为了账号安全,请及时绑定邮箱和手机立即绑定

移动Safari自动对焦文本字段

移动Safari自动对焦文本字段

暮色呼如 2019-08-08 15:29:04
移动Safari自动对焦文本字段在Mobile Safari中,在设置延迟时间后,我无法将注意力集中在文本字段上。我附上一些展示问题的示例代码。如果单击该按钮,则触发.focus(),一切都按预期工作。如果你把焦点放在回调上,比如setTimeout函数,那么它只能在移动safari中失败。在所有其他浏览器中,有一个延迟,然后焦点发生。令人困惑的是,即使在移动游猎中,也会触发“focusin”事件。这个(和SO中的〜类似〜评论)让我觉得它是一个移动的safari bug。任何指导都将被接受。我已经在模拟器和iPhone 3GS / 4 iOS4上进行了测试。示例HTML:<!DOCTYPE html>    <html lang='en'>      <head>        <title>Autofocus tests</title>        <meta content='width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0' name='viewport'>        <meta content='yes' name='apple-mobile-web-app-capable'>      </head>      <body>       <h1>          Show keyboard without user focus and select text:      </h1>        <p>          <button id='focus-test-button'>            Should focus on input when you click me after .5 second        </button>          <input id='focus-test-input' type='number' value='20'>        </p>        <script type="text/javascript">          //<![CDATA[         var button = document.getElementById('focus-test-button');         var input  = document.getElementById('focus-test-input');         input.addEventListener('focusin', function(event) {           console.log('focus');           console.log(event);         });         button.addEventListener('click', function() {           // *** If triggered immediately - functionality occurs as expected           // input.focus();           // *** If called by callback - triggers the focusin event, but does not bring up keyboard or cursor           var t = setTimeout("input.focus();",500);         });         //]]>       </script>     </body>   </html>
查看完整描述

3 回答

?
跃然一笑

TA贡献1826条经验 获得超6个赞

我认为这是移动Safari的一个功能,而不是一个bug。在我们关于FastClick的工作中,我和我的同事发现,如果调用堆栈中的第一个函数是由非程序化事件触发的,iOS将只允许在函数内的其他元素上触发焦点。在您的情况下,调用setTimeout启动一个新的调用堆栈,安全机制启动,以防止您将焦点设置在输入上。

请记住,在iOS设置上,关注输入元素会调出键盘 - 因此所有那些专注于页面加载的输入元素的网页,就像Google一样,在iOS上使用会非常烦人。我猜Apple决定他们必须采取措施来防止这种情况发生。所以我不同意@DA:这是一个功能,而不是一个bug。

对此没有已知的解决方法,所以你必须放弃使用延迟的想法。

从iOS 5开始,允许由合成点击事件触发的处理程序触发对输入元素的关注。尝试更新的FastClick输入焦点示例


查看完整回答
反对 回复 2019-08-08
?
慕哥6287543

TA贡献1831条经验 获得超10个赞

只有当原始事件来自用户交互而不是来自setTimeout时,才能通过调度click事件来提升键盘。我相信结果是你可以从touchend事件中提升键盘,但仍然不会超时。


查看完整回答
反对 回复 2019-08-08
?
SMILET

TA贡献1796条经验 获得超4个赞

至少在iOS 5.1上的Safari上,此问题已修复。您的FastClick作品,即合成点击事件不会失败焦点。然而,这并不能帮助那些希望他们的单个focus()代码能够在所有iOS版本上工作的人,感叹。


查看完整回答
反对 回复 2019-08-08
  • 3 回答
  • 0 关注
  • 398 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号