美文网首页
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