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

Question

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];
}

Answer 1

// 这是经典闭包问题了，最简单的方法，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];
}

Answer 2

写个加载的方法，递归就完了

Answer 3

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

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

}

Answer 4

问题已经解决,应该是图片引用的不对.抱歉浪费各位大神的时间了!

data:image/jpeg;base64,/9j/4AAQSkZJRgABAQIAJgAmAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoK...略....
上面是引用的图片地址,改成下面的就正常执行了,
https://ss1.bdstatic.com/70cF...