javascript - 单击两次后无法在 iOS 上输入 html 输入字段

Question

我在 iOS 上遇到了一个问题，我为此做了一个小提琴：

http://jsfiddle.net/Hk56Q/

如果为任何触摸事件（touchstart/touchmove/touchend）添加了一个事件监听器到文档中，像这样：

function onTouch( e ){};
document.addEventListener( 'touchstart', onTouch, false );

这导致输入字段在 iOS 上具有以下行为：

• 第一次触摸：输入获得焦点，用户可以正确输入
• 随后的触摸（关注已经到位的字段）：打字不再起作用

我在 iPad 和 iPhone（模拟器和实际设备）上的 iOS 5、5.1 和 6 上遇到并测试了这个问题。

唯一的修复似乎是删除事件侦听器以恢复输入字段的正确行为（或者实际上根本不添加侦听器）：

document.removeEventListener( 'touchstart', onTouch);

我还注意到，如果页面上有多个 iframe，其中一个将侦听器添加到其文档中，它也会破坏另一个 iframe 的输入字段。

小提琴在我的 Android 手机上运行正常。

任何想法为什么会发生这种情况？或者如何在不破坏 iOS 输入的情况下为触摸事件设置全局自定义事件处理程序？

Answer 1

这是一种解决方法。将焦点设置到窗口，然后返回节点，超时：

function fixIpadTouch(node){
    node.ontouchend=function(e){
        if(document.activeElement===node){
            window.focus();
            setTimeout(function(){
                node.focus();
            },0);
        }
    }
}

Answer 2

在我的情况下，特里的答案的一个变体解决了这个 Mobile Safari 错误（！！！）。在这里，“#input”，此代码位于 iframe 页面上：

var el = $('#input');
el.on('keydown', function() {
  window.focus()
  el.focus()
});

该错误以多种方式触发，但“keydown”可靠地通过。这也使得下一个“按键”到达。

Answer 3

jQuery Mobile 1.2.0 应该是你需要的

证明！在勾选方框之前：

勾选方框后：