javascript - js image的onload没有在图片加载完成后执行

问题描述

问 题

1.想定的效果是每加载完成一张图片,alert"1",实际效果确是所有图片加载完成之后,alert4次
2.以下是代码,求大腿给解解惑.
//imgArray[] 这里有4张图片链接,太长就不写了
var count = 0;

for (var i = 0; i < imgArray.length; i++) {
    var imgobj = new Image();
    imgobj.onload = function () {
        alert("1");
        if (count == imgArray.length - 1) {
            loading.style.display = "none";
        }
        ++count;

    };

    imgobj.src = imgArray[i];
}

解决方案

// 这是经典闭包问题了，最简单的方法，var改成let试试
for (let i = 0; i < imgArray.length; i++) {
    let imgobj = new Image();
    imgobj.onload = function () {
        alert("1");
        if (count == imgArray.length - 1) {
            loading.style.display = "none";
        }
        ++count;

    };

    imgobj.src = imgArray[i];
}

这篇关于javascript - js image的onload没有在图片加载完成后执行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！