判断iframe是否加载完成的完美方法


Posted in Javascript onJanuary 07, 2010
var iframe = document.createElement("iframe"); 
iframe.src = "https://3water.com"; if (!/*@cc_on!@*/0) { //if not IE 
iframe.onload = function(){ 
alert("Local iframe is now loaded."); 
}; 
} else { 
iframe.onreadystatechange = function(){ 
if (iframe.readyState == "complete"){ 
alert("Local iframe is now loaded."); 
} 
}; 
} 
document.body.appendChild(iframe);

最近, Nicholas C. Zakas 文章《Iframes, onload, and document.domain》的评论中 Christopher 提供了一个新的判断方法(很完美):

var iframe = document.createElement("iframe"); 
iframe.src = "https://3water.com"; if (iframe.attachEvent){ 
iframe.attachEvent("onload", function(){ 
alert("Local iframe is now loaded."); 
}); 
} else { 
iframe.onload = function(){ 
alert("Local iframe is now loaded."); 
}; 
} 
document.body.appendChild(iframe);

几点补充说明:

IE 支持 iframe 的 onload 事件,不过是隐形的,需要通过 attachEvent 来注册。
第二种方法比第一种方法更完美,因为 readystatechange 事件相对于 load 事件有一些潜在的问题。

Javascript 相关文章推荐
cssQuery()的下载与使用方法
Jan 12 Javascript
window.addeventjs事件驱动函数集合addEvent等
Feb 19 Javascript
iframe 自适应高度[在IE6 IE7 FF下测试通过]
Apr 13 Javascript
解决火狐浏览器下JS setTimeout函数不兼容失效不执行的方法
Nov 14 Javascript
JavaScript导出Excel实例详解
Nov 25 Javascript
Javascript基础教程之数据类型 (布尔型 Boolean)
Jan 18 Javascript
JS修改iframe页面背景颜色的方法
Apr 01 Javascript
easyui简介_动力节点Java学院整理
Jul 14 Javascript
jQuery实现base64前台加密解密功能详解
Aug 29 jQuery
SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题的解决方法
Jan 09 Javascript
用VueJS写一个Chrome浏览器插件的实现方法
Feb 27 Javascript
详解微信小程序「渲染层网络层错误」的解决方法
Jan 06 Javascript
Extjs学习笔记之五 一个小细节renderTo和applyTo的区别
Jan 07 #Javascript
EXT中xtype的含义分析
Jan 07 #Javascript
Extjs学习笔记之四 工具栏和菜单
Jan 07 #Javascript
Extjs学习笔记之三 extjs form更多的表单项
Jan 07 #Javascript
Extjs学习笔记之二 初识Extjs之Form
Jan 07 #Javascript
Extjs学习笔记之一 初识Extjs之MessageBox
Jan 07 #Javascript
jQuery DOM操作小结与实例
Jan 07 #Javascript
You might like
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
ubuntu10.04配置 nginx+php-fpm模式的详解
2013/06/03 PHP
getimagesize获取图片尺寸实例
2014/11/15 PHP
javascript 显示当前系统时间代码
2009/12/28 Javascript
jQuery 版元素拖拽原型代码
2011/04/25 Javascript
没有document.getElementByName方法
2013/08/19 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
2016/12/05 Javascript
基于jQuery代码实现圆形菜单展开收缩效果
2017/02/13 Javascript
JS实现的Unicode编码转换操作示例
2017/04/28 Javascript
JS实现图片点击后出现模态框效果
2017/05/03 Javascript
网页中的图片查看器viewjs使用方法
2017/07/11 Javascript
JS实现中文汉字按拼音排序的方法
2017/10/09 Javascript
基于JavaScript实现报警器提示音效果
2017/10/27 Javascript
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
2017/11/27 Javascript
微信小程序使用audio组件播放音乐功能示例【附源码下载】
2017/12/08 Javascript
Element图表初始大小及窗口自适应实现
2020/07/10 Javascript
[01:30:54]《加油DOTA》 第三期
2014/08/18 DOTA
[32:39]完美世界DOTA2联赛循环赛 Forest vs Inki BO2第一场 11.04
2020/11/04 DOTA
python strip()函数 介绍
2013/05/24 Python
Python线程同步的实现代码
2018/10/03 Python
Python 最大概率法进行汉语切分的方法
2018/12/14 Python
Django基础三之视图函数的使用方法
2019/07/18 Python
Python使用Pandas库常见操作详解
2020/01/16 Python
pycharm无法导入本地模块的解决方式
2020/02/12 Python
Python绘图之二维图与三维图详解
2020/08/04 Python
python IP地址转整数
2020/11/20 Python
希尔顿酒店官方网站:Hilton Hotels
2017/06/01 全球购物
Skyscanner加拿大:全球旅行搜索平台
2018/11/19 全球购物
Edwaybuy西班牙:小米在线商店
2019/12/04 全球购物
T3官网:头发造型工具
2019/12/26 全球购物
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
幼儿园园长自我鉴定
2013/10/22 职场文书
应届实习生的自我评价范文
2014/01/05 职场文书
代领学位证书毕业证书委托书
2014/09/30 职场文书
巴黎圣母院观后感
2015/06/10 职场文书
火锅店的开业营销方案范本!
2019/07/05 职场文书