应用的onClick到的iFrame(Apply onClick to Iframe)

有什么办法来“封装”的iframe与一些其他的元素，以模拟的onClick？ 我知道的iframe不支持事件，但我需要跟踪从我的网站，离开直通I帧点击。

谢谢！

Answer 1:

如果画面中包含相同的域页面（不违反同源策略 ），你可以用它的文档直接互动：

<script type="text/javascript">
window.onload = function() {
    var oFrame = document.getElementById("myframe");
    oFrame.contentWindow.document.onclick = function() {
        alert("frame contents clicked");
    };
};
</script>

如果它包含外部页面，那么你的运气了 - 没办法做你想要什么明显的安全原因。 虽然所有的内容是相同的页面的视觉部分，帧来自不同网域的必须脚本方面保持分离。 否则，任何页面可以例如创建一个隐藏的iframe装载您的网络邮件并从中窃取你的会话cookie。 所有的数据是用户可访问的，但它不应该是页面作者访问。

Answer 2:

尝试使用： https://github.com/vincepare/iframeTracker-jquery

因为它是无法读取从父页面iframe中的内容（DOM）由于同源策略，跟踪是基于相关的网页/ IFRAME边界监控系统告诉了这iframe是在任何时候将鼠标光标模糊事件。

适应所要跟踪与jQuery选择和调用iframeTracker有回调函数检测到的iframe点击时会被称为IFRAME元素：

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

还有更多的选择。

Answer 3:

以上脚本将在IFRAME测试点击功能工作的伟大。 更具体地说，如果您使用的是谷歌的新的analytics.js跟踪代码事件跟踪来跟踪在iframe点击，上面的代码是这样的：

<script type="text/javascript">
window.onload = function() {
    var oFrame = document.getElementById("myframe");
    oFrame.contentWindow.document.onclick = function() {
        ga('send', 'event', 'link', 'click', 'My Frame Was Clicked');
    };
};
</script>

而内嵌框架可以是这样的（注意ID =“myframe”在JavaScript中引用）：

<iframe id="myframe" src="http://www.yourowndomain.com" scrolling="yes" marginwidth="0" marginheight="0" vspace="0" hspace="0" height="800" style="border:0; overflow:hidden; width:100%;"></iframe>

然后测试该事件的点击，如果你熟悉谷歌的事件追踪中，在标准报告>实时>活动的谷歌分析仪表盘的点击会显示为事件操作：单击，事件标签：我的框架被点击。 或长期在仪表板下的行为>事件。

我测试过这一点，并为以前的海报时表示的iframe源是在同一个域中，这只会工作。

文章来源: Apply onClick to Iframe