JavaScript-如何监控iframe里面页面的点击事件?

JavaScript-如何监控iframe里面页面的点击事件?

灵芸 发布于 2017-08-26 字数 479 浏览 2980 回复 5

我的页面上有一个iframe,引用的是第三方网站的页面,因为跨域了,我没法控制页面,现在我想监控iframe一些按钮的点击事件,统计点击量,想听听大家的方案,如果有代码更好

补充一下,如果只监控iframe一些按钮的点击事件可能有点难,如果能做到监控iframe页面被点击了也基本可以

完善一下,是我的网站的页面上,要给做第三方做广告,广告是以iframe的形式放在页面上的,广告很简单,一般是用户点一下就会跑到第三方商户的页面,所以我们这边想监控这个广告的点击效果,以便跟第三方核对数据

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

夜无邪 2017-10-26 5 楼

这么久了没人给出好答案,我说一下我这边后来的解决方案吧,我是在iframe上遮挡了一层div,然后通过记录div上的点击来实现的,如下所示:

<div style="height: 100%;width:400px;height:80px;overflow: hidden;position: relative;">
<iframe src="http://www.baidu.com" style="height: 100%;position: absolute;top: 0;width: 100%;display:block;" frameborder="0" scrolling="no"></iframe>
<div style="width: 100%;height:100%;position: absolute;top: 0;">
<a href="http://news.baidu.com/" style="top:30px;left:115px;width:35px;height:20px;position: absolute;background: #666;display:block; opacity:0;filter:alpha(opacity=0);-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'" onclick="alert('add log');location.replace(this.href);return false"></a>
</div>
</div>

希望能看到更好的答案

甜柠檬 2017-10-25 4 楼

 <script>

function ifr(){
window.frames['iframe_name'].document.body.onclick=function (){ /*逻辑代码*/ };
}
setInterval("ifr()",1);//用一个计时器对iframe页面时时监控

</script>

上面是对所有iframe里的onclick事件进行监控,比如如果你想监控某个button或其他标签,把body换成按钮name就可以了。试试!

清晨说ぺ晚安 2017-10-22 3 楼

jQuery可实现为页面对象动态添加事件的方法,给广告添加一个点击事件计数就可以实现了

甜柠檬 2017-09-26 2 楼

监听iframe里的第三方页面就已经算是跨域了,如果有操作对iframe里的第三方页面有操作权限,那么可以看看

jquery中对 iframe的操作

如果没有操作权限,那就完全没有办法了。

归属感 2017-08-26 1 楼

这段代码 你应该非常喜欢的 hdframe 为 frameid

var IframeOnClick = {
resolution: 200,
iframes: [],
interval: null,
Iframe: function() {
this.element = arguments[0];
this.cb = arguments[1];
this.hasTracked = false;
},
track: function(element, cb) {
this.iframes.push(new this.Iframe(element, cb));
if (!this.interval) {
var _this = this;
this.interval = setInterval(function() { _this.checkClick(); }, this.resolution);
}
},

checkClick: function() {

if (document.activeElement) {
var activeElement = document.activeElement;
for (var i in this.iframes) {
if (activeElement === this.iframes[i].element) { // user is in this Iframe
if (this.iframes[i].hasTracked == false) {
this.iframes[i].cb.apply(window, []);
this.iframes[i].hasTracked = true;
}
} else {
this.iframes[i].hasTracked = false;
}
}
}
}
};
<script type="text/javascript">
IframeOnClick.track(document.getElementById("hdframe"), function() { alert('a click');});
</script>