获取子页面iframe的点击事件及iframe跨域的交互

1、获取子页面iframe的点击事件

  1.1、获取iframe

    var frame = document.getElementById('addrClick2');

  1.2、获取点击事件

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;
}
}
}
}
};
//此处写iframe点击后需要处理的事
IframeOnClick.track(frame, function () {
处理的事
});

2、iframe跨域的交互
2.1、获取iframe
  var frame = document.getElementById('addrClick2');
2.2向子页面传输信息
  frame.contentWindow.postMessage('setLocation,' + null + "," + null, '*');
  setLocation,可随意编写,只要和iframe里的message的方法对应上
2.3、获取子页面传输的信息
window.addEventListener('message', function (event) {
//此处执行事件
var data = event.data;
var str = data.split(',');
if ("setLocation" == str[0]) {
getLocation(str[1], str[2]);
if (str[3]) {
getJKInfo(str[3]);
}
}
  })
 
 

转载于:https://www.cnblogs.com/coolSome/p/11010344.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值