单击附加到document.body的事件监听器不要在iOS6中触发?

bon*_*ers 5 javascript delegation event-handling ios6

在iOS6中遇到奇怪的行为和不起作用的事件委托,其根源是如果我只是将一个事件处理程序附加到document.body,如下所示:

document.body.addEventListener("click", function(){alert("ios6 sucks")}, false);
Run Code Online (Sandbox Code Playgroud)

这不会运行,例如,如果我去google.com并通过safari远程webinspector添加.在某些情况下,它会运行,包括如果我点击页面上的链接,或者点击一个直接附加了事件处理程序的元素.在主流浏览器和iOS 5和4上同样可以正常工作.添加touchend到body会触发它应该是一个潜在的解决方法但是让浏览器检测点击而不是在touchstart中编写一些点击检测真的更好/ touchend.我想知道这是不是iOS6的bug.但我还没有看到其他人抱怨这个.

小智 0

@Bonkers ...引用为什么在将单击事件附加到 div 后触发主体单击完全是由于事件冒泡。

我在这里复制了您的代码,显示它在 div 上被调用两次,但在 body 上只被调用一次:

<div id="myDiv">FlackAttack Test</div>

<script>
document.body.addEventListener("click", function(){alert("ios6 sucks")}, false);
document.getElementById('myDiv').addEventListener('click', function(){alert("ios6 sucks twice")},      false);
</script>
Run Code Online (Sandbox Code Playgroud)

如果你想阻止事件冒泡,你可以调用 e.stopPropagation(); 或 e.cancelBubble = true;