判断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 相关文章推荐
跟随鼠标旋转的文字
Nov 30 Javascript
javascript 对象定义方法 简单易学
Mar 22 Javascript
原生javascript兼容性测试实例
Jul 01 Javascript
老生常谈JavaScript数组的用法
Jun 10 Javascript
JS简单实现浮动窗口效果示例
Sep 07 Javascript
简单实现js进度条加载效果
Mar 25 Javascript
js实现鼠标移动到图片产生遮罩效果
Oct 21 Javascript
vue 将页面公用的头部组件化的方法
Dec 18 Javascript
微信小程序中悬浮窗功能的实现代码
Aug 02 Javascript
基于jQuery实现挂号平台首页源码
Jan 06 jQuery
js删除指定位置超链接中含有百度与360的标题
Jan 06 Javascript
用javascript制作qq注册动态页面
Apr 14 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上传图片类(随机名,缩略图,加水印)
2010/06/30 PHP
CI框架源码阅读,系统常量文件constants.php的配置
2013/02/28 PHP
PHP判断FORM表单或URL参数来的数据是否为整数的方法
2016/03/25 PHP
在Laravel框架里实现发送邮件实例(邮箱验证)
2016/05/20 PHP
基于PHP实现短信验证码接口(容联运通讯)
2016/09/06 PHP
一个高效的JavaScript压缩工具下载集合
2007/03/06 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
详解JS函数重载
2014/12/04 Javascript
js使用post 方式打开新窗口
2015/02/26 Javascript
JavaScript定时显示广告代码分享
2015/03/02 Javascript
深入理解JavaScript系列(37):设计模式之享元模式详解
2015/03/04 Javascript
Angular2进阶之如何避免Dom误区
2018/04/02 Javascript
Javascript格式化并高亮xml字符串的方法及注意事项
2018/08/13 Javascript
详解vantUI框架在vue项目中的应用踩坑
2018/12/06 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
2020/12/28 Javascript
Python使用urllib2模块抓取HTML页面资源的实例分享
2016/05/03 Python
用python做一个搜索引擎(Pylucene)的实例代码
2017/07/05 Python
python smtplib模块实现发送邮件带附件sendmail
2018/05/22 Python
django+tornado实现实时查看远程日志的方法
2019/08/12 Python
Python二元赋值实用技巧解析
2019/10/25 Python
Pyspark获取并处理RDD数据代码实例
2020/03/27 Python
pycharm使用技巧之自动调整代码格式总结
2020/11/04 Python
详解H5本地储存Web Storage
2017/07/03 HTML / CSS
Html5大文件断点续传实现方法
2015/12/05 HTML / CSS
美国网上购买眼镜:Eyeconic
2017/07/29 全球购物
英国历史最悠久的DJ设备供应商:DJ Finance、DJ Warehouse、The DJ Shop
2019/09/04 全球购物
Whistles官网:英国女装品牌
2020/08/14 全球购物
阿联酋最好的手机、电子产品和家用电器网上商店:Eros Digital Home
2020/08/09 全球购物
接口中的方法可以是abstract的吗
2015/07/23 面试题
在网络中有两台主机A和B,并通过路由器和其他交换设备连接起来,已经确认物理连接正确无误,怎么来测试这两台机器是否连通?如果不通,怎么来判断故障点?怎么排
2014/01/13 面试题
计算机专业学生的自我评价
2013/12/15 职场文书
关于圣诞节的广播稿
2014/01/26 职场文书
12.4全国法制宣传日活动总结
2014/11/01 职场文书
525心理健康活动总结
2015/05/08 职场文书
详解Redis主从复制实践
2021/05/19 Redis
详解Java七大阻塞队列之SynchronousQueue
2021/09/04 Java/Android