Javascript - 等待图像加载

Question

var l = false;
var l2 = false;

var imm = new Image();
imm.src = "b.png";

imm.onload = function(){
l = true;
}

var imm2 = new Image();
imm2.src = "c.png";

imm2.onload = function(){
l2 = true;
}

只有在 l 时，我才能告诉这个 javascript 启动一个函数和 l2是真的吗？我应该设置一个循环来不断检查这两个变量吗？有没有更有效的方法？我不希望我的脚本在没有图像的情况下启动，而是使用 .onload我可以等待只加载一张图片，而不是所有图片。谢谢你的帮助!

Answer 1

我认为更优雅的方式:

var loadedImagesCount = 0;
var imageNames = ["b.png", "c.png"];
var imagesArray = [];
for (var i = 0; i < imageNames.length; i++) {
    var image = new Image();
    image.src = imageNames[i];
    image.onload = function(){
        loadedImagesCount++;
        if (loadedImagesCount >= imageNames.length) {
            //loaded all pictures
        }
    }
    imagesArray.push(image);
}

而不是搞乱许多不同的图像变量，只需将图像名称存储在普通数组中，然后循环遍历并计算加载了多少图片。