博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
用document.activeElement解决iframe跨域问题
阅读量:6427 次
发布时间:2019-06-23

本文共 1483 字,大约阅读时间需要 4 分钟。

iframe里面一般都会使用别人的URL,没有很多交互,使用document.activeElement可以对iframe进行事件监听。

使用下面的类进行测试:

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                            this.iframes[i].cb.apply(window, []);                    }                }            }        }    };            var index = layer.open({            type: 2,            content: 'http://layim.layui.com',            area: ['320px', '195px'],            maxmin: true,            success:function (layero,index) {                var iframeWin = window[layero.find('iframe')[0]['name']];                IframeOnClick.track(layero.find('iframe')[0], function() { console.log("testtttt") });            }        });        layer.full(index);

转载于:https://blog.51cto.com/mawielbue/2149181

你可能感兴趣的文章
图解SSIS监视文件夹并自动导入数据
查看>>
Lucene.Net 2.3.1开发介绍 —— 四、搜索(一)
查看>>
MyBatis Review——开发Dao的方法
查看>>
技术研发国产化进程加快 看传感器企业如何展示十八般武艺
查看>>
技术助力第三次革命
查看>>
《HTML与CSS入门经典(第8版)》——2.6 总结
查看>>
新手指南:在 Ubuntu 和 Fedora 上安装软件包
查看>>
在 CentOS7.0 上搭建 Chroot 的 Bind DNS 服务器
查看>>
大型网站的 HTTPS 实践(二):HTTPS 对性能的影响
查看>>
《Swift 权威指南》——第6章,第6.10节嵌套函数
查看>>
《自己动手做交互系统》——1.3 本章小结
查看>>
Mobile devices bundled with malware?
查看>>
《JavaScript面向对象精要》——1.5 访问属性
查看>>
《Python数据可视化编程实战》—— 第 1 章 准备工作环境
查看>>
Android应用性能优化最佳实践.1.1 Android Studio的优势
查看>>
《设计模式解析(第2版•修订版)》—第2章 2.2节什么是UML
查看>>
【直播】APP全量混淆和瘦身技术揭秘
查看>>
10个大坑,当你产品上架AppStore会遇到
查看>>
【shell 脚本】两种登录方式
查看>>
学习编程的方法
查看>>