解决IE中img.onload失效的方法

原来

$("#QrCode").on("load",function(){
    $(".loading").hide();
    alert(1);
})
//或者
document.getElementById("QrCode").onload = function(){
    $(".loading").hide();
    alert(1);
}

看起来没什么问题,但是为什么onload在ie下经常没有被调用呢?因为浏览器会缓存图片,第二次加载的图片不是从服务器传过来的,不会发起请求,但是图片的complete属性会被加上。alert(1);每次都会执行,所以猜测是错误的。

修改代码如下

var img = new Image();
img.onload = function(){

  document.getElementById("QrCode").setAttribute("src",this.src)
    $("#loading").hide();
}
img.src = "/img/img.jpg";

  

onload事件写到给imgage对象的src赋值之前了,先告诉浏览器如何处理这张图片,再指定这张图片的源,这样就正常了。

所以,不是IE浏览 器没有触发onload事件,而是因为加载缓冲区的速度太快了,以至于没有运行到obj.onload的时候,onload事件已经触发了。

 

posted @ 2014-09-19 12:54  Qi~  阅读(4108)  评论(0编辑  收藏  举报