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异步编程的4种方法让你写出更出色的程序
Jan 17 Javascript
JavaScript弹出窗口方法汇总
Aug 12 Javascript
js获取当前时间显示在页面上并每秒刷新
Dec 24 Javascript
移动端点击图片放大特效PhotoSwipe.js插件实现
Aug 25 Javascript
Node.js批量给图片加水印的方法
Nov 15 Javascript
jquery获取下拉框中的循环值
Feb 08 Javascript
基于jQuery的左滑出现删除按钮的示例
Aug 29 jQuery
Vue2.0子同级组件之间数据交互方法
Feb 28 Javascript
详解如何配置vue-cli3.0的vue.config.js
Aug 23 Javascript
LayUI动态设置checkbox不显示的解决方法
Sep 02 Javascript
layer 刷新某个页面的实现方法
Sep 05 Javascript
JavaScript中Object、map、weakmap的区别分析
Dec 15 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 编写大型网站问题集
2010/05/07 PHP
PHP的魔术常量__METHOD__简介
2014/07/08 PHP
php 使用array函数实现分页
2015/02/13 PHP
JS event使用方法详解
2008/04/28 Javascript
基于JQuery 的消息提示框效果代码
2011/07/31 Javascript
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
2012/02/10 Javascript
js 三级关联菜单效果实例
2013/08/13 Javascript
replace()方法查找字符使用示例
2013/10/28 Javascript
node.js中的fs.chmodSync方法使用说明
2014/12/18 Javascript
js实现精美的图片跟随鼠标效果实例
2015/05/16 Javascript
Bootstrap基本插件学习笔记之轮播幻灯片(23)
2016/12/08 Javascript
Cookies 和 Session的详解及区别
2017/04/21 Javascript
js 倒计时(高效率服务器时间同步)
2017/09/12 Javascript
Three.js加载外部模型的教程详解
2017/11/10 Javascript
javascript获取图片的top N主色值方法详解
2018/01/26 Javascript
vue.js中ref和$refs的使用及示例讲解
2019/08/14 Javascript
关于JS解构的5种有趣用法
2019/09/05 Javascript
layui异步加载table表中某一列数据的例子
2019/09/16 Javascript
vue iview的菜单组件Mune 点击不高亮的解决方案
2019/11/01 Javascript
javascript实现倒计时提示框
2021/03/02 Javascript
python实现学生管理系统
2018/01/11 Python
Python3 itchat实现微信定时发送群消息的实例代码
2019/07/12 Python
Python读取表格类型文件代码实例
2020/02/17 Python
基于python 将列表作为参数传入函数时的测试与理解
2020/06/05 Python
纽约市的奢华内衣目的地:Anya Lust
2019/08/02 全球购物
Python如何实现单例模式
2016/06/03 面试题
计算机专业推荐信范文
2013/11/27 职场文书
单位领导证婚词
2014/01/14 职场文书
小学教师评语大全
2014/04/23 职场文书
政治思想表现评语
2014/05/04 职场文书
创先争优活动心得体会
2014/09/04 职场文书
法定代表人身份证明书(含说明)
2014/10/02 职场文书
悬崖上的金鱼姬观后感
2015/06/15 职场文书
2016年小学植树节活动总结
2016/03/16 职场文书
公文格式,规则明细(新手收藏)
2019/07/23 职场文书
2019关于垃圾分类处理的调查报告
2019/12/26 职场文书