JS 图片预加载技术

项目开发中时常需要用 JS 判断一张图片是否加载成功,

如果图片加载成功,则执行其相应的 onload 绑定事件,

这个就是我们所说的图片预加载技术,先上最终版代码:

  1. function loadImage(url, callback) {   
  2.     var img = new Image();   
  3.     img.onload = function () {   
  4.         img.onload = null;   
  5.         callback(img);   
  6.     }   
  7.     img.src = url;   
  8. }  

经测试发现 IE6、IE7、IE8:

如果图片已经存于浏览器缓存中,那么再次对该图片发起请求时,

浏览器就会直接从缓存中加载,这样就无法触发其 onload 事件。

Read More >