文件load事件:img、iframe
iframe的 load 事件
在所有为IFRAME动态添加onload监听事件的方法中,只有 使用事件监听方式为 IFRAME 的 onload 事件绑定处理函数,IE6、7、8才有效。所以为 IFRAME 添加load事件完美方案如下:
// 事件监听兼容方案
function addEvent(elem,event,fn){
if (elem.attachEvent) {
elem.attachEvent('on'+event,fn)
} else {
elem.addEventListener(event,fn,false)
}
} window.onload = function(){
var iframeA = document.createElement('iframe');
iframeA.src = 'http://www.baidu.com'
addEvent(iframeA,'load',function(){
document.body.bgColor = '#000'; // 回调函数
});
document.body.appendChild(iframeA);
}
优化页面建议不要嵌套iframe,但是在内部项目还是很常见。其实在IE中,监控iframe加载完毕还可以采取监听 onreadystatechange 事件。
IMG的 load 事件
img的load事件,我们使用 new Image()。这里我们得注意 complete 事件。研究网上的得出以下代码:
var img = new Image();
img.src= "http://i1.hoopchina.com.cn/user/627/17191627/17191627_big_3.jpg";
if (img.complete || img.width) {
alert("该图片已经在缓存中,不需要再下载")
alert(img.height)
} else {
img.onload = function() {
alert("图片加载完成");
alert(img.height)
}
}
文件load事件:img、iframe的更多相关文章
- jQuery中ready与load事件
jQuery中ready与load事件(来自慕课网) jQuery有3种针对文档加载的方法 $(document).ready(function() { // ...代码... }) //docume ...
- jQuery学习一:jQuery中的ready和load事件
//ready事件 $(document).ready(function(){ 代码........ }); //ready事件简写: $(function(){ 代码........ }); //l ...
- jQuery 的ready事件和 JavaScript 的load事件对比
为了理解2个事件的异同,先了解一下HTML文档加载顺序 HTML DOM文档加载步骤 HTML DOM文档加载是按顺序执行的,这与浏览器的渲染方式有关,一般浏览器渲染操作的顺序大致按如下几个步骤 1, ...
- jQuery中ready与load事件的区别
1.摘要 大家在编程中使用jQuery还有JS的时候一定会在使用之前这样: //document ready $(document).ready(function(){ ...code... }) / ...
- jquery load ($.load) 事件用法与分析(转)
首先我们需要清楚的是jquery load方法是对jQuery.ajax()进行封装以方便我们使用的一个方法,当我们需要处理较为复杂的逻辑时候,还是需要用到jQuery.ajax()这个比较全面的方法 ...
- 原 jQuery中document的ready和load事件的区别?
概述: 大家在工作中用jQuery的时候一定会在使用之前这样: 1 2 3 4 5 6 7 8 //document ready $(document).ready(function(){ ...
- (转载) 上传文件进度事件,进度事件(Progress Events)
转载URL:https://www.w3cmm.com/ajax/progress-events.html MDN参考:https://developer.mozilla.org/zh-CN/docs ...
- jQuery的ready与js的load事件的区别
摘自:http://www.cnblogs.com/see7di/archive/2011/07/15/2239677.html 为了理解这两个事件的异同,读者应该先了解HTML文档加载的顺序. DO ...
- firefox-5.x关于img标签的load事件、svg、ff5.4audio标签显示的适配tip
1.firefox中img标签的load事件后获取图片宽高错误. 需求是根据图片加载后的大小宽高比,调整图片显示的宽高. 在chrome浏览器下,使用jquery的load方法监听img标签的&quo ...
随机推荐
- 013-HQL中级3-Hive四种数据导入方式介绍
Hive的几种常见的数据导入方式这里介绍四种:(1).从本地文件系统中导入数据到Hive表:(2).从HDFS上导入数据到Hive表:(3).从别的表中查询出相应的数据并导入到Hive表中:(4).在 ...
- Spring整合jdbc编程
一.Spring对Jdbc的支持 Spring为了提供对Jdbc的支持,在Jdbc API的基础上封装了一套实现,以此建立一个 JDBC 存取框架. 作为 Spring JDBC 框架的核心, ...
- 斯坦福第二课:单变量线性回归(Linear Regression with One Variable)
二.单变量线性回归(Linear Regression with One Variable) 2.1 模型表示 2.2 代价函数 2.3 代价函数的直观理解 I 2.4 代价函数的直观理解 I ...
- 在MFC中实现对象之间数据的传递。
方法一: 第一步:在VS2010里面新建一个单文档MFC程序. 第二步:在App类里面的头文件里面 定义性声明一个变量 ,见下面程序 public: CString ii; 第三步:在App类的实现文 ...
- Springboot 日志管理配置logback-spring.xml
几种常见的日志 Log4j:是最早的日志框架,是apach旗下的,可以单独使用,也可配合日志框架JCL使用: Log4j2:apach旗下的关于log4j的升级版: Logback:是基于slf4j接 ...
- selenium+python学习总结
学习了一个月的selenium+python,终于学有所成,下面以一个简单的项目来总结学习所得. 1. 项目结构 在项目结构中,大家要注意到:每一个源文件夹中都要有一个__init__ ...
- Winter-1-B Sum 解题报告及测试数据
Time Limit:500MS Memory Limit:32768KB Description Hey, welcome to HDOJ(Hangzhou Dianzi University O ...
- webpack打包静态资源和动态资源
1.对于静态引用的资源: <img src = "static/modelname/imgname.png"> // 修改为下面的写法 <img src = &q ...
- pom.xml文件报错:web.xml is missing and <failOnMissingWebXml> is set to true
这个错误原因是因为项目无法加载到web.xml,所以需要配置web项目的目录.具体解决,配置步骤如下: 1.右键项目属性,配置项目目录 /src/main/webapp,如果没有,新增一条 2.配置 ...
- 【Linux学习】3.Linux常见配置文件
一./etc 配置文件/etc/passwd 用户数据库,其中的域给出了用户名.真实姓名.家目录.加密口令和用户的其他信息 /etc/group 类似/etc/passwd ,但说明的不是用户而是组. ...