youtube - 移动 Safari YouTube IFRAME 事件问题

Question

语境：

我有一个容器元素，它是 iPad Mobile Safari 窗口宽度和高度的 100%，在其中我有一个 YouTube IFRAME 来嵌入视频（100% 宽度和高度）。

问题是我还有一个固定在页面右上角的关闭按钮。关闭按钮的 Z 索引比 iframe 高，并且有一个点击监听器会提示“foo”（没有 Web 调试的 iOS6 上没有可用的 console.log）。

在 IFRAME 中的播放按钮被按下之前，当它被点击时，关闭按钮的回调会被调用。按下 IFRAME 中的播放按钮后，永远不会调用关闭按钮回调，而是在 IFRAME 中切换视频控件。

在 Nexus 7 上的 Google Chrome 上不存在此问题，而在 iPad 上的 Mobile Safari 上不存在。

链接： http: //pastie.org/8030167

http://jsfiddle.net/amyMM/

document.querySelector(".close").addEventListener("click", function(e) {

alert("foo")

e.preventDefault()
e.stopPropagation()

return false
})

更多信息：

在窗口上为 touchstart、touchmove 和 touchend 添加侦听器后，所有这些事件都无法在页面上的任何位置触发，直到视频播放完毕，之后事件仅在关闭按钮上触发。