Mobile Safari - Autofocus not working

Question

On mobile safari on iPhone...

Before I move on and mark this as unresolvable... is there anyway to autofocus an input field once the page loads? I don't care when the autofocus gets triggered - I just want it to be automatic vs. clicking somewhere. I've tried js, HTML5, and jQuery = all failed. I know there is 100+ post, from back when. I just want to make sure there is no way to do this.

<input autofocus id="AutoFocusMe" type="text" placeholder="Email Address"/>

JS I've tried:

$("#AutoFocusMe").focus();

...

document.getElementById("AutoFocusMe").focus();

...

    if (!("autofocus" in document.createElement("input"))) 
{document.getElementById("AutoFocusMe").focus(); }

and

setTimeout(function() {
jQuery('#AutoFocusMe').focus();
}, 500);

Add this to the list now...

document.getElementById('AutoFocusMe').click();

Answer 1

what about just checking if autofocus is undefined after the window is loaded, making sure all form elements are loaded.

My example runs in codepen debug mode (no iframe)

http://s.codepen.io/jonathan/debug/xwgWKe ?

You need to run this code either on a remote server or local server, not through an iframe through JSfiddle or CodePen . JSfiddele and CodePen run code within an iframe. My example above runs in Codepen Debug mode. So it doesn't run the code in an iframe. An iframe will block the autofocus

// wait until all links, inputs, images are loaded
$(window).on("load", function(){

   if(document.createElement("input").autofocus === undefined) {
       $("[autofocus]").filter(":last").focus();
   }

});

if autofocus attribute is undefined you use an attribute selector to give focus to the last input with the autofocus attribute.

The reason i used jQuery on() load event handler, was to make sure that the event listener fires consistently for cross browser. Since the window.load doesn't work consistently cross browser.