美文网首页
JS判断多张图片加载完成-来自于三人行慕课

JS判断多张图片加载完成-来自于三人行慕课

作者: 三人行慕课 | 来源:发表于2019-06-05 17:08 被阅读0次

原文链接:https://www.3mooc.com/front/articleinfo/281

可以采用es6中的Promise.all()来实现

let mulitImg = [

 'http://www.3mooc.com/wp-content/uploads/2019/5/1.jpg',

 'http://www.3mooc.com/wp-content/uploads/2019/5/2.jpg',

 'http://www.3mooc.com/wp-content/uploads/2019/5/3.jpg',

 'http://www.3mooc.com/wp-content/uploads/2019/5/4.jpg'

];

let promiseAll = [], img = [], imgTotal = mulitImg.length;

for(let i = 0 ; i < imgTotal ; i++){

 promiseAll[i] = new Promise((resolve, reject)=>{

     img[i] = new Image()

     img[i].src = mulitImg[i]

     img[i].onload = function(){

          //第i张加载完成

          resolve(img[i])

     }

 })

}

Promise.all(promiseAll).then((img)=>{

 //全部加载完成

})

相关文章

网友评论

      本文标题:JS判断多张图片加载完成-来自于三人行慕课

      本文链接:https://www.haomeiwen.com/subject/otysxctx.html