判断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 相关文章推荐
jQuery弹出层始终垂直居中相对于屏幕或当前窗口
Apr 01 Javascript
js中substring和substr的定义和用法
May 05 Javascript
谷歌浏览器不支持showModalDialog模态对话框的解决方法
Sep 22 Javascript
jQuery实现的Div窗口震动效果实例
Aug 07 Javascript
JavaScript+html5 canvas制作的圆中圆效果实例
Jan 27 Javascript
jQuery查找节点并获取节点属性的方法
Sep 09 Javascript
Vue代码分割懒加载的实现方法
Nov 23 Javascript
微信小程序使用radio显示单选项功能【附源码下载】
Dec 11 Javascript
JsChart组件使用详解
Mar 04 Javascript
微信小程序登录数据解密及状态维持实例详解
May 06 Javascript
jQuery与原生JavaScript选择HTML元素集合用法对比分析
Nov 26 jQuery
基于vue实现微博三方登录流程解析
Nov 04 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中heredoc的使用方法
2013/06/17 PHP
php获取网站百度快照日期的方法
2015/07/29 PHP
PHP实现动态压缩js与css文件的方法
2018/05/02 PHP
Maps Javascript
2007/01/22 Javascript
js右键菜单效果代码
2007/07/21 Javascript
Javascript 日期处理之时区问题
2009/10/08 Javascript
关于JS字符串函数String.replace()
2013/04/07 Javascript
JS获取当前网页大小以及屏幕分辨率等
2014/09/05 Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
2016/07/08 Javascript
JS面试题---关于算法台阶的问题
2016/07/26 Javascript
JS正则替换掉小括号及内容的方法
2016/11/29 Javascript
jQuery实现CheckBox全选、全不选功能
2017/01/11 Javascript
JS实现异步上传压缩图片
2017/04/22 Javascript
手把手教你搭建ES6的开发运行环境
2017/07/11 Javascript
浅谈Node.js爬虫之网页请求模块
2018/01/11 Javascript
vue2.0 实现导航守卫(路由守卫)
2018/05/21 Javascript
vue中接口域名配置为全局变量的实现方法
2018/09/20 Javascript
VUE基于NUXT的SSR 服务端渲染
2018/11/30 Javascript
jQuery zTree插件使用简单教程
2019/08/16 jQuery
vue学习笔记之给组件绑定原生事件操作示例
2020/02/27 Javascript
解决vue里a标签值解析变量,跳转页面,前面加默认域名端口的问题
2020/07/22 Javascript
python正则表达式判断字符串是否是全部小写示例
2013/12/25 Python
Python编程入门的一些基本知识
2015/05/13 Python
Python爬虫抓取论坛关键字过程解析
2020/10/19 Python
Python的信号库Blinker用法详解
2020/12/31 Python
HTML5中form如何关闭自动完成功能的方法
2018/07/02 HTML / CSS
管理部部长岗位职责
2013/12/05 职场文书
2013年员工自我评价范文
2013/12/27 职场文书
2014年教师培训的自我评价
2014/01/03 职场文书
银行学习十八大感想
2014/01/11 职场文书
创先争优制度
2014/01/21 职场文书
汽车维修工岗位职责
2014/02/12 职场文书
学校校庆演讲稿
2014/05/22 职场文书
公安机关党的群众路线教育实践活动剖析材料
2014/10/10 职场文书
在CSS中使用when/else的方法
2022/01/18 HTML / CSS
Elasticsearch Recovery 详细介绍
2022/04/19 Java/Android