检测iframe内的点击

Question

我想检测点击内部iframe不onclick上iframe本身我试过onclick事件你必须点击iframe本身触发功能我甚至尝试addeventlistener到窗口或文档没有工作,好像iframe不存在功能永远triger当我点击里面iframe :(请帮忙

Answer 1

仅适用于同一域中的iframe:

$('body', $('select-your-iframe-here').contents()).click(function(event) {
  console.log('Clicked! ' + event.pageX + ' - ' + event.pageY);
});

Answer 2

出于安全原因,Web浏览器不允许您访问iframe的内容(除非iframe与父页面位于同一个域中).

但是有一种解决方法,使用在点击iframe时触发的模糊事件(因为当iframe获得焦点时,父页面会丢失它).

我写了一个jQuery插件,它使用这个技巧来检测iframe上的点击,它可以在这里找到:https://github.com/finalclap/iframeTracker-jquery.您可以在http://www.finalclap.com/tuto/track-iframe-click-jquery-87/上阅读该教程(它是法语版).

要使用它,您只需匹配要跟踪的iframe元素,并提供回调函数:

jQuery(document).ready(function($){
    $('.iframe_wrap iframe').iframeTracker({
        blurCallback: function(){
            // Do something when iframe is clicked (like firing an XHR request)
        }
    });
});

Answer 3

出于安全原因，您不应该能够跟踪访问其他网站的 IFRAME 中的活动。如果您自己的网站上有一个 IFRAME，该 IFRAME 会转到您自己网站上的另一个页面，则可以通过直接在 IFRAME 运行的代码中添加点击跟踪来解决此问题。

如果这是不可能的，您可以考虑为 IFRAME:ed 网络服务器运行您自己的自定义代理服务器，这样您就可以再次添加您自己的点击跟踪。有关代码示例，请参阅 _why 的 Mousehole。