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 相关文章推荐
JQuery 学习笔记 选择器之一
Jul 23 Javascript
过虑特殊字符输入的js代码
Aug 05 Javascript
JavaScript两种跨域技术全面介绍
Apr 16 Javascript
javascript模拟php函数in_array
Apr 27 Javascript
jQuery插件cxSelect多级联动下拉菜单实例解析
Jun 24 Javascript
Bootstrap php制作动态分页标签
Dec 23 Javascript
如何写好一个vue组件,老夫的一年经验全在这了(推荐)
May 18 Javascript
vue实现搜索过滤效果
May 28 Javascript
JS立即执行的匿名函数用法分析
Nov 04 Javascript
Javascript幻灯片播放功能实现过程解析
May 07 Javascript
js在HTML的三种引用方式详解
Aug 29 Javascript
javascript实现放大镜功能
Dec 09 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连mysql和oracle数据库性能比较
2006/10/09 PHP
php判断访问IP的方法
2015/06/19 PHP
PHP preg_match实现正则表达式匹配功能【输出是否匹配及匹配值】
2017/07/19 PHP
jQuery(非HTML5)可编辑表格实现代码
2012/12/11 Javascript
Jquery中使用setInterval和setTimeout的方法
2013/04/08 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
jquery 清空file域示例(兼容个浏览器)
2013/10/11 Javascript
提取字符串中年月日的函数代码
2013/11/05 Javascript
如何判断鼠标是否在DIV的区域内
2013/11/13 Javascript
javascript日期格式化示例分享
2014/03/05 Javascript
修复bash漏洞的shell脚本分享
2014/12/31 Javascript
Node.js + Redis Sorted Set实现任务队列
2016/09/19 Javascript
JS批量替换内容中关键词为超链接
2017/02/20 Javascript
angularJS 发起$http.post和$http.get请求的实现方法
2017/05/18 Javascript
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
2017/08/24 Javascript
jQuery实现的事件绑定功能基本示例
2017/10/11 jQuery
JavaScript的词法结构精华篇
2018/10/17 Javascript
layui文件上传控件带更改后数据传值的方法
2019/09/23 Javascript
ES6扩展运算符和rest运算符用法实例分析
2020/05/23 Javascript
Openlayers实现扩散的动态点(水纹效果)
2020/08/17 Javascript
JS绘图Flot如何实现动态可刷新曲线图
2020/10/16 Javascript
[13:55]Newbee vs Team Spirit
2018/06/07 DOTA
Python中的ConfigParser模块使用详解
2015/05/04 Python
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
python实现查找所有程序的安装信息
2020/02/18 Python
python-xpath获取html文档的部分内容
2020/03/06 Python
关于Theano和Tensorflow多GPU使用问题
2020/06/19 Python
在pycharm中文件取消用 pytest模式打开的操作
2020/09/01 Python
全球性的在线婚纱礼服工厂:27dress.com
2019/03/21 全球购物
DataList 能否分页,请问如何实现?
2015/05/03 面试题
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2014/07/21 面试题
大二自我鉴定
2014/01/31 职场文书
数控技术专业毕业自荐书范文
2014/02/05 职场文书
阳光体育活动实施方案
2014/05/25 职场文书
2014年酒店服务员工作总结
2014/12/08 职场文书
因家庭原因离职的辞职信范文
2015/05/12 职场文书