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 相关文章推荐
替代window.event.srcElement效果的可兼容性的函数
Dec 18 Javascript
jQuery AnythingSlider滑动效果插件
Feb 07 Javascript
JavaScript操作DOM元素的childNodes和children区别
Apr 01 Javascript
使用AngularJS处理单选框和复选框的简单方法
Jun 19 Javascript
jquery获取url参数及url加参数的方法
Oct 26 Javascript
10分钟掌握XML、JSON及其解析
Dec 06 Javascript
使用bat打开多个cmd窗口执行gulp、node
Feb 17 Javascript
微信小程序 生命周期函数详解
May 24 Javascript
JavaScript该如何学习 怎样轻松学习JavaScript
Jun 12 Javascript
js实现把时间戳转换为yyyy-MM-dd hh:mm 格式(es6语法)
Dec 28 Javascript
JS控制鼠标拒绝点击某一按钮的实例
Dec 29 Javascript
详解webpack-dev-server的简单使用
Apr 02 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代码
2007/03/08 PHP
PHP 快速排序算法详解
2014/11/10 PHP
深入分析PHP优化及注意事项
2016/07/04 PHP
PHP模型Model类封装数据库操作示例
2019/03/14 PHP
laravel 框架实现无限级分类的方法示例
2019/10/31 PHP
由prototype_1.3.1进入javascript殿堂-类的初探
2006/11/06 Javascript
动态加载JS文件的三种方法
2013/11/08 Javascript
使用js如何实现全选与全不选
2013/12/30 Javascript
使用JQUERY进行后台页面布局控制DIV实现左右式
2014/01/07 Javascript
jQuery中:text选择器用法实例
2015/01/03 Javascript
JavaScript运算符小结
2015/06/03 Javascript
javascript实现信息增删改查的方法
2015/07/25 Javascript
jquery+ajax请求且带返回值的代码
2015/08/12 Javascript
原生JS实现美图瀑布流布局赏析
2015/09/07 Javascript
jquery validate demo 基础
2015/10/29 Javascript
JS实现的二叉树算法完整实例
2017/04/06 Javascript
React Js 微信禁止复制链接分享禁止隐藏右上角菜单功能
2017/05/26 Javascript
js轮播图无缝滚动效果
2017/06/17 Javascript
详解在HTTPS 项目中使用百度地图 API
2019/04/26 Javascript
判断文字超过2行添加展开按钮,未超过则不显示,溢出部分显示省略号
2019/04/28 Javascript
JavaScript实现飞舞的泡泡效果
2020/02/07 Javascript
[44:15]国士无双DOTA2 6.82版本详解(上)
2014/09/28 DOTA
在Python中使用NLTK库实现对词干的提取的教程
2015/04/08 Python
Python实现自动添加脚本头信息的示例代码
2016/09/02 Python
python 实现删除文件或文件夹实例详解
2016/12/04 Python
python得到单词模式的示例
2018/10/15 Python
python 将列表中的字符串连接成一个长路径的方法
2018/10/23 Python
python scrapy爬虫代码及填坑
2019/08/12 Python
keras 多gpu并行运行案例
2020/06/10 Python
马来西亚在线药房:RoyalePharma
2019/12/01 全球购物
美国在线购买空气净化器、除湿器、加湿器网站:AllergyBuyersClub
2021/03/16 全球购物
乡下人家教学反思
2014/02/01 职场文书
光信息科学与技术专业职业生涯规划
2014/03/13 职场文书
学习雷锋活动总结
2014/04/29 职场文书
中学后勤工作总结2015
2015/07/22 职场文书
python 批量压缩图片的脚本
2021/06/02 Python