iFrame点击事件未触发。

Question

如何使用JQuery捕获iframe上的点击事件。 我有一个Amazon横幅广告，当用户单击iframe时，我需要关闭其容器DIV。 我尝试过“contents”，在iframe上绑定单击事件，但都没有成功。 当我单击iframe时，它会在另一个标签页上打开Amazon页面，但单击事件从未触发。 我设置了断点和警报以确保。

我正在使用最新的JQuery版本1.9，并在Chrome上进行了测试。 我还考虑捕获全局点击（$（document）.click）并检查单击区域，但是当我单击iframe时，$（document）.click不会触发。 有什么建议吗？

再次说明，这是一个Amazon横幅广告iframe，它托管在Amazon上而不是在我的服务器上。

常规on绑定示例： http://jsbin.com/oyanis/4/edit

- Liron Harel

---

由于安全限制，这将无法工作。 - Oliver

谢谢。有没有其他方法可以捕捉点击事件，比如根据鼠标的x,y坐标在iframe区域内.. 有什么建议吗？ - Liron Harel

您可以叠加一个透明的div，但是这样用户就需要点击两次。很抱歉，目前没有便捷的解决方案。 - Oliver

它的工作当然需要使用activeElement技巧。请阅读我的答案。 - Julian Hille

Answer 1

有一个巧妙的技巧可以在 iframe 内容上获得“点击”。

您可以使用以下方法：

<div id="iframeinside">
    <iframe />
</div>

现在可以在js中这样说：

 var oldActive = document.activeElement; /* getting active Element */
 var frame = $('#iframeinside iframe')[0];
 $('#iframeinside').mouseenter(function() {
      /* Setting interval to 1ms for getting eventually x,y mouse coords*/
      oldActive = document.activeElement;
      setInterval('doSomething()', 1); 
 });

 $('#iframeinside').mouseleave(function () {
      /* clear interval cause we arent over the element anymore*/
      clearInterval(intervalId); 
 });

这些时间间隔的调用:

function doSomething() {
    /* if the focus has changed to the iframe */
    if(oldActive != frame && document.activeElement == frame) {
        oldActive = document.activeElement;
        alert(myQuery);
        alert('click did happen to the iframe');
    }
}

我曾多次使用这个，它总是能正常工作。但我没有测试过在IE6、7以及更老的版本上是否兼容。

- Julian Hille

---

正是我想要的，但现在我们无法检测到iframe内部也被点击的元素，对吧？ - Miguel

很抱歉，但这就是你能达到的极限。这意味着你做不到。这是浏览器安全限制！ - Julian Hille

这是一个不错的解决方案，但仅适用于Firefox。它甚至在Chrome中也无法工作。 - aishazafar

当我编写它的时候，它在所有主要浏览器中都能够完美地工作，即使是一些IE7。 - Julian Hille