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 相关文章推荐
Javascript中正则表达式的全局匹配模式分析
Apr 26 Javascript
JS判断当前日期是否大于某个日期的实现代码
Sep 02 Javascript
addEventListener和attachEvent二者绑定的执行函数中的this不相同
Dec 09 Javascript
JQuery的自定义事件代码,触发,绑定简单实例
Aug 01 Javascript
详解javascript传统方法实现异步校验
Jan 22 Javascript
jQuery控制li上下循环滚动插件用法实例(附demo源码下载)
May 28 Javascript
Javascript 对cookie操作详解及实例
Dec 29 Javascript
使用AngularJS2中的指令实现按钮的切换效果
Mar 27 Javascript
详解有关easyUI的拖动操作中droppable,draggable用法例子
Jun 03 Javascript
vue项目引入字体.ttf的方法
Sep 28 Javascript
详解Vue3 Teleport 的实践及原理
Dec 02 Vue.js
微信小程序实现购物车小功能
Dec 30 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 实现代码复用的一个方法 traits新特性
2015/02/22 PHP
php计算函数执行时间的方法
2015/03/20 PHP
php 指定范围内多个随机数代码实例
2016/07/18 PHP
php操纵mysqli数据库的实现方法
2016/09/18 PHP
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
2010/05/24 Javascript
浅谈JavaScript之事件绑定
2013/07/08 Javascript
关于RequireJS的简单介绍即使用方法
2016/10/20 Javascript
JavaScript获取短信验证码(周期性)
2016/12/29 Javascript
利用node.js写一个爬取知乎妹纸图的小爬虫
2017/05/03 Javascript
Django中使用jquery的ajax进行数据交互的实例代码
2017/10/15 jQuery
vue项目中用cdn优化的方法
2018/01/03 Javascript
javaScript强制保留两位小数的输入数校验和小数保留问题
2018/05/09 Javascript
javascript中UMD规范的代码推演
2018/08/29 Javascript
vue中的计算属性实例详解
2018/09/19 Javascript
在vue项目中优雅的使用SVG的方法实例详解
2018/12/03 Javascript
微信小程序 checkbox使用实例解析
2019/09/09 Javascript
JS如何在数组指定位置插入元素
2020/03/10 Javascript
vue中移动端调取本地的复制的文本方式
2020/07/18 Javascript
[48:21]Mski vs VGJ.S Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
Python中编写ORM框架的入门指引
2015/04/29 Python
Python爬虫实例爬取网站搞笑段子
2017/11/08 Python
利用Tkinter(python3.6)实现一个简单计算器
2017/12/21 Python
Python利用ORM控制MongoDB(MongoEngine)的步骤全纪录
2018/09/13 Python
django的ORM模型的实现原理
2019/03/04 Python
使用Python 自动生成 Word 文档的教程
2020/02/13 Python
python实现井字棋小游戏
2020/03/04 Python
pyinstaller打包成无控制台程序时运行出错(与popen冲突的解决方法)
2020/04/15 Python
怎么快速自学python
2020/06/22 Python
手把手教你从PyCharm安装到激活(最新激活码),亲测有效可激活至2089年
2020/11/25 Python
python报错TypeError: ‘NoneType‘ object is not subscriptable的解决方法
2020/11/05 Python
台湾森森购物网:U-mall
2017/10/16 全球购物
网络安全方面的面试题
2016/01/07 面试题
总结表彰大会主持词
2014/03/26 职场文书
幼师中班个人总结
2015/02/12 职场文书
管理者们如何制定2019年的工作计划?
2019/07/01 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书