前端开发

 首页 > 前端开发 > jquery教程 > 解决IE中img.onload失效的方法

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

分享到:
【字体:
导读:
         [导读] 原来 $(#QrCode).on(load,function(){ $(.loading).hide(); alert(1); }) //或者 document.getElementById(QrCode).onload = function(){ $(.loading).hide(); alert(1); } 看起来没什么问题,但是为什么onload在ie下经常没有被调用...

原来


$("#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事件已经触发了。


分享到:
生成二维码的 jQuery 插件:jquery.qrcod...
jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery 插件,它使用非常简单,生成的 QRcode 无需下载图片,并且不依赖第三方服务,比如最近 Google 服务在国内访问不稳就造成我好几个网站的 QRcode 不能使用,并且压缩之后大小小于 4K。 jquery.qrcode.js 使用 1. 加载 jQuery 和 jquery.qrcode.js: 2. 创建一个...
关于img的onload事件兼容ie下的bug问题
我 们都知道onload事件是在img加载完成后触发的事件,但是ie下这个onload事件并没有想像中的灵,特别是在ie7/ie6下,网上的解释是ie因为缓存关系造成的 img.onload 事件没有被激发,因为ie这个东西喜欢异步,所以由缓存的问题,网页获取到图片的时间极短(应该比代码解释的时间快)所以造成了onload事件被错过了。网上一般...
  •         php迷,一个php技术的分享社区,专属您自己的技术摘抄本、收藏夹。
  • 在这里……