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 相关文章推荐
学习面向对象之面向对象的术语
Nov 30 Javascript
屏蔽相应键盘按钮操作
Mar 10 Javascript
浅谈JavaScript变量的自动转换和语句
Jun 12 Javascript
基于Vue2的移动端开发环境搭建详解
Nov 03 Javascript
EasyUI Combobox设置默认值 获取text的方法
Nov 28 Javascript
AngularJS使用ng-app自动加载bootstrap框架问题分析
Jan 04 Javascript
underscore之Chaining_动力节点Java学院整理
Jul 10 Javascript
javascript+css3开发打气球小游戏完整代码
Nov 28 Javascript
vue router动态路由设置参数可选问题
Aug 21 Javascript
vue服务端渲染操作简单入门实例分析
Aug 28 Javascript
js实现div色块拖动录制
Jan 16 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
Jan 11 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
星际流派综述
2020/03/04 星际争霸
php实现多张图片上传加水印技巧
2013/04/18 PHP
使用PHP进行微信公众平台开发的示例
2015/08/21 PHP
php中使用array_filter()函数过滤数组实例讲解
2021/03/03 PHP
JavaScript 图片预览效果 推荐
2009/12/22 Javascript
javascript获取选中的文本的方法代码
2013/10/30 Javascript
javascript判断变量是否有值的方法
2015/04/20 Javascript
js钢琴按钮波浪式图片排列效果代码分享
2015/08/26 Javascript
jQuery图片轮播插件——前端开发必看
2016/05/31 Javascript
Bootstrap开发实战之响应式轮播图
2016/06/02 Javascript
JavaScript实现输入框与清空按钮联动效果
2016/09/09 Javascript
JavaScript的兼容性与调试技巧
2016/11/22 Javascript
深入理解react-router@4.0 使用和源码解析
2017/05/23 Javascript
微信小程序开发之toast提示插件使用示例
2017/06/08 Javascript
vue实现页面加载动画效果
2017/09/19 Javascript
vue router下的html5 history在iis服务器上的设置方法
2017/10/18 Javascript
对angularJs中controller控制器scope父子集作用域的实例讲解
2018/10/08 Javascript
微信JS-SDK实现微信会员卡功能(给用户微信卡包里发送会员卡)
2019/07/25 Javascript
微信小程序网络请求实现过程解析
2019/11/06 Javascript
使用python实现正则匹配检索远端FTP目录下的文件
2015/03/25 Python
python实现将元祖转换成数组的方法
2015/05/04 Python
Python找出list中最常出现元素的方法
2016/06/14 Python
Python 闭包的使用方法
2017/09/07 Python
Python3 queue队列模块详细介绍
2018/01/05 Python
windows下安装Python的XlsxWriter模块方法
2018/05/03 Python
5分钟 Pipenv 上手指南
2018/12/20 Python
使用OpenCV实现仿射变换—平移功能
2019/08/29 Python
无需JS和jQuery代码实现CSS3鼠标浮动放大图片
2016/11/21 HTML / CSS
解析浏览器的一些“滚动”行为鉴赏
2019/09/16 HTML / CSS
英国的领先快速时尚零售商:In The Style
2019/03/25 全球购物
英国领先的在线鱼贩:The Fish Society
2020/08/12 全球购物
为什么要用EJB
2014/04/17 面试题
2015年城管个人工作总结
2015/05/15 职场文书
市直属机关2016年主题党日活动总结
2016/04/05 职场文书
《工作是最好的修行》读后感3篇
2019/12/13 职场文书
javascript实现计算器功能详解流程
2021/11/01 Javascript