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


Posted in Javascript onOctober 26, 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 = "http://sc.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 相关文章推荐
获取select元素被选中的文本内容的js代码
Jan 29 Javascript
每天一篇javascript学习小结(Array数组)
Nov 11 Javascript
深入解析Backbone.js框架的依赖库Underscore.js的作用
May 07 Javascript
解析JavaScript模仿块级作用域
Dec 29 Javascript
JavaScript中localStorage对象存储方式实例分析
Jan 12 Javascript
浅析Vue中method与computed的区别
Mar 06 Javascript
在小程序/mpvue中使用flyio发起网络请求的方法
Sep 13 Javascript
vue实现微信二次分享以及自定义分享的示例
Mar 20 Javascript
vue.js 2.0实现简单分页效果
Jul 29 Javascript
vue-cli3.0实现一个多页面应用的历奇经历记录总结
Mar 16 Javascript
nuxt 每个页面head标签内容设置方式
Nov 05 Javascript
JavaScript实现酷炫的鼠标拖尾特效
Feb 18 Javascript
Javascript下判断是否为闰年的Datetime包
Oct 26 #Javascript
基于jquery的给文章加入关键字链接
Oct 26 #Javascript
EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码
Oct 26 #Javascript
自写的一个jQuery圆角插件
Oct 26 #Javascript
jQuery获取地址栏参数插件(模仿C#)
Oct 26 #Javascript
自制轻量级仿jQuery.boxy对话框插件代码
Oct 26 #Javascript
jquery ui resizable bug解决方法
Oct 26 #Javascript
You might like
(PHP实现)只使用++运算实现加法,减法,乘法,除法
2013/06/27 PHP
PHP中使用TCPDF生成PDF文档实例
2014/07/01 PHP
PHP翻页跳转功能实现方法
2020/11/30 PHP
PHP实现基于文本的摩斯电码生成器
2016/01/11 PHP
6个常见的 PHP 安全性攻击实例和阻止方法
2020/12/16 PHP
IE6与IE7中,innerHTML获取param的区别
2009/03/15 Javascript
JQuery上传插件Uploadify使用详解及错误处理
2010/04/27 Javascript
IE8 中使用加速器(Activities)
2010/05/14 Javascript
Extjs中ComboBoxTree实现的下拉框树效果(自写)
2013/05/28 Javascript
不同编码的页面表单数据乱码问题解决方法
2015/02/15 Javascript
JavaScript通过function定义对象并给对象添加toString()方法实例分析
2015/03/23 Javascript
js实现带缓动动画的导航栏效果
2017/01/16 Javascript
JavaScript中使用Async实现异步控制
2017/08/15 Javascript
vue.js默认路由不加载linkActiveClass问题的解决方法
2017/12/11 Javascript
原生JS进行前后端同构
2018/04/22 Javascript
详解Angular模板引用变量及其作用域
2018/11/23 Javascript
微信二次分享报错invalid signature问题及解决方法
2019/04/01 Javascript
JavaScript Canvas编写炫彩的网页时钟
2019/10/16 Javascript
js实现石头剪刀布游戏
2020/10/11 Javascript
利用Python爬取可用的代理IP
2016/08/18 Python
django 创建过滤器的实例详解
2017/08/14 Python
Python实现学生成绩管理系统
2020/04/05 Python
pandas值替换方法
2018/07/10 Python
python关于矩阵重复赋值覆盖问题的解决方法
2019/07/19 Python
django执行数据库查询之后实现返回的结果集转json
2020/03/31 Python
IntelliJ 中配置 Anaconda的过程图解
2020/06/01 Python
Python matplotlib 绘制双Y轴曲线图的示例代码
2020/06/12 Python
通过代码简单了解django model序列化作用
2020/11/12 Python
js实现移动端H5页面手指滑动刻度尺功能
2017/11/16 HTML / CSS
网站域名和主机:Domain.com
2019/04/01 全球购物
英文自荐信格式
2013/11/28 职场文书
公司领导班子群众路线四风问题对照检查材料
2014/10/02 职场文书
2015年初中教师个人工作总结
2015/07/21 职场文书
2016年少先队活动总结
2016/04/06 职场文书
node.js如何自定义实现一个EventEmitter
2021/07/16 Javascript
HTML常用标签超详细整理
2022/03/19 HTML / CSS