How to avoid automatic focus on first input field when popping a HTML form as a JQuery dialog?

What I did was I created an extra input and made it invisible (style="display:none") then gave it the property autofocus="true" put this at the end of your dialog content so it wont mess with anything. it should look like this:

        <div><!--dialog div-->
           <button></button>
           <button></button> 
          <input type="hidden" autofocus="true" />
        </div>

Adding this tag as the first input field on the page works for me.

<input type="text" autofocus="autofocus" style="display:none" />

No need for javascript and keeps the tab order if you want to use the tab key to move through the fields.

(Tested on Chrome > 65, Firefox > 59 and Edge)

A solution is to set tabindex="-1" on ALL input fields to keep HTML placeholders visible.