移动 Safari - 自动对焦不起作用

Question

在 iPhone 上的移动 Safari 上...

在我继续并将其标记为无法解决之前...是否有在页面加载后自动聚焦输入字段？我不在乎何时触发自动对焦-我只希望它是自动的而不是单击某处。我试过 js、HTML5 和 jQuery = 都失败了。我知道有 100 多个帖子，从那时起。我只是想确保没有办法做到这一点。

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

我试过的JS：

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

...

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

...

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

和

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

立即将其添加到列表中...

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

Answer 1

在加载窗口后检查autofocus 是否为undefined，确保所有表单元素都已加载。

我的示例在 codepen 调试模式下运行（无 iframe）

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

您需要在远程服务器或本地服务器上运行此代码，而不是通过 JSfiddle 或 CodePen 的 iframe。 JSfiddele 和 CodePen 在 iframe 中运行代码。我上面的示例在 Codepen 调试模式下运行。所以它不会在 iframe 中运行代码。 iframe 将阻止autofocus

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

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

});

如果autofocus 属性为undefined，则使用属性选择器将焦点放在具有autofocus 属性的最后一个输入上。

我使用 jQuery on() load 事件处理程序的原因是为了确保跨浏览器一致地触发事件侦听器。由于window.load 不能跨浏览器始终如一地工作。