vue判断iframe加载完成

需求描述: 最近,项目中遇到iframe引入页面,并给iframe内部全部元素注册点击事件得需求。html

在注册事件以前,首先咱们要获取iframe内部元素。跨域问题已被后端老哥解决。后端

最初的想法: 项目采用VUE,想法是在nextTick钩子里面获取到iframe的内部dom.事实上,在最简单的状况下,也就是iframe内部没有其余iframe元素时能够成功。若是iframe内部嵌套多个iframe,此时并不能注册成功,暂时解决方法就是定时器轮询,功能实现却是能够,可是做为最终么有办法的方案。跨域

解决方法: 后来找到,iframe自带有load方法,在iframe加载完成后执行的钩子。bash

多说无益,贴代码dom

html:
<iframe id="ifra" name="ifra" width="100%" height="500" src="http://xxxxx">
</iframe>
复制代码
mounted() {
    const self = this
    this.$nextTick(() =>{
    	const iframe = document.querySelector('#ifra')
    	if (iframe.attachEvent) {    
    		iframe.attachEvent("onload", function() {    
    			const iframeNode = window.frames["ifra"].document
    			self.getDom(iframeNode)			
    		});    
    	} else {    
    		iframe.onload = function() {    
    			const iframeNode = window.frames["ifra"].document
    			self.getDom(iframeNode)
    		};    
    	}
    })
}
复制代码
相关文章
相关标签/搜索