zoukankan      html  css  js  c++  java
  • 文件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)	
    	}
    }
    		
  • 相关阅读:
    9.19 数组 冒泡排序和二分法
    9,18 考试
    html5学习拓展
    第七天,
    第六天 js 开始
    第五天 列表 流
    第四天 样式,框架
    硬件攻城狮设计需要考量的11个关键因素
    步进电机的驱动方式
    MOS管防反接电路设计
  • 原文地址:https://www.cnblogs.com/flxy-1028/p/7049181.html
Copyright © 2011-2022 走看看