html判断图片加载完成,javascript判断所有图片是否加载完成

由于load()事件在1.8版本中被废弃，因此前面的jquery判断多张图片是否加载完成代码(兼容IE)代码只能在jQuery低版本下使用，下面的判断所有图片是否加载的函数代码基于原生javascript代码，兼容大部分浏览器。

函数代码：

function loadImg(arr) {

var newimages = [];

var arr = (typeof arr != 'object') ? [arr] : arr;

for (var i = 0; i < arr.length; i++) {

newimages[i] = new Promise(function(resolve, reject){

var image = new Image();

image.addEventListener('load', function listener() {

resolve(image);

this.removeEventListener('load', listener);

});

image.src = arr[i];

image.addEventListener('error', reject);

});

}

return newimages;

}

调用函数：

$(function () {

var listpic = new Array();

$('img').each(function(){

listpic.push($(this).attr('src'));

});

Promise.all(loadImg(listpic)).then(function(){

console.log('图片全部加载完成');

});

});

代码来自：https://segmentfault.com/q/1010000014701009/a-1020000014702682