判断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 相关文章推荐
原生javascript兼容性测试实例
Jul 01 Javascript
JS对文本框值的判断示例
Mar 10 Javascript
jQuery实现长按按钮触发事件的方法
Feb 02 Javascript
javascript实现鼠标移到Image上方时显示文字效果的方法
Aug 07 Javascript
基于jQuery通过jQuery.form.js插件使用ajax提交form表单
Aug 17 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
Jan 27 Javascript
JS中传递参数的几种不同方法比较
Jan 20 Javascript
Vue.js常用指令之循环使用v-for指令教程
Jun 27 Javascript
Nuxt.js踩坑总结分享
Jan 18 Javascript
AngularJs用户输入动态模板XSS攻击示例详解
Apr 21 Javascript
js简单的分页器插件代码实例
Sep 11 Javascript
Antd中单个DatePicker限定时间输入范围操作
Oct 29 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
全国FM电台频率大全 - 15 山东省
2020/03/11 无线电
PHP个人网站架设连环讲(二)
2006/10/09 PHP
php上的memcache和memcached两个pecl库
2010/03/29 PHP
php实现的替换敏感字符串类实例
2014/09/22 PHP
Zend Framework前端控制器用法示例
2016/12/11 PHP
PHP中通过getopt解析GNU C风格命令行选项
2019/11/18 PHP
脚本吧 - 幻宇工作室用到js,超强推荐base.js
2006/12/23 Javascript
验证码按回车不变解决方法
2013/03/29 Javascript
jquery 通过name快速取值示例
2014/01/24 Javascript
js 事件截取enter按键页面提交事件示例代码
2014/03/04 Javascript
js隐式全局变量造成的bug示例代码
2014/04/22 Javascript
JS实现网页滚动条感应鼠标变色的方法
2015/02/26 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
javascript实现简单的全选和反选功能
2016/01/05 Javascript
jquery checkbox的相关操作总结
2016/10/17 Javascript
js 将canvas生成图片保存,或直接保存一张图片的实现方法
2018/01/02 Javascript
在vue使用clipboard.js进行一键复制文本的实现示例
2019/01/15 Javascript
原生JS实现萤火虫效果
2020/03/07 Javascript
JS判断浏览器类型与操作系统的方法分析
2020/04/30 Javascript
[59:44]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 paiN vs iG
2018/03/31 DOTA
Python的pycurl包用法简介
2015/11/13 Python
pytorch 获取tensor维度信息示例
2020/01/03 Python
Python super()函数使用及多重继承
2020/05/06 Python
HTML5的结构和语义(4):语义性的内联元素
2008/10/17 HTML / CSS
用HTML5制作视频拼图的教程
2015/05/13 HTML / CSS
中国综合性网上购物商城:当当(网上卖书起家)
2016/11/16 全球购物
洛佩桑酒店官方网站:Lopesan Hotels
2019/04/15 全球购物
您熟悉ORM(Object-Relation Mapping)吗?请谈谈您所理解的ORM
2016/02/08 面试题
给校长的建议书100字
2014/05/16 职场文书
教师考核材料
2014/05/21 职场文书
团支部推优材料
2014/05/21 职场文书
护理专业毕业生自荐书
2014/05/24 职场文书
2016年国庆节67周年活动总结
2016/04/01 职场文书
从结婚开始的恋爱故事。小说《我的美好婚事》TV动画化决定
2022/04/07 日漫
Golang连接并操作MySQL
2022/04/14 MySQL
Win10/Win11 任务栏替换成经典样式
2022/04/19 数码科技