Javascript 仅当图像加载时才继续for循环 函数readXML（）{ var xmlDoc=loadXML（）； var x=xmlDoc.getElementsByTagName（“图像”）； 对于（i=0；i

我希望我的

for

循环仅在img.onLoad完成时继续到下一个迭代。我正在使用的

while

会阻塞代码，并且不允许img.onLoad完成。有办法做到这一点吗？无需更改代码结构。

您可以检查img的.complete属性：

var x=document.getElementById（“myImg”）.complete；

---

结果可能是真的，也可能是假的

如果我理解正确，我相信您最好的选择是使用（如果您希望它是串行的，它们有一个函数用于它-串行）

---

此函数可以为您执行一系列任务，并在完成时发出回调（在回调中，您会收到错误通知）。

仅在启动onload时处理下一个映像，不要使用循环。使

InfoImage

接受一个回调，当onload函数启动时执行该回调。使用它来执行一个函数，该函数将检查数组中的下一个索引，如果它存在，它可以添加它，如果没有，它可以调用另一个函数或运行其他一些代码来传递该点。因此，首先添加索引0（如果存在），以此类推。

function readXML(){
    var xmlDoc = loadXML();
    var x = xmlDoc.getElementsByTagName("image");
    for (i = 0; i < x.length; i++) {
        if (i == 600){
            break;
        }
        var path = x[i].getElementsByTagName("path")[0].childNodes[0].nodeValue;
        var title = x[i].getAttribute("class");
        this.imageArray.push(new InfoImage(path,title));
        while(this.imageArray[i].isImageLoaded() == false); //something like this
        console.log(this.imageArray[i].getMaxPixels());

    }
}

function InfoImage(path,title){
    this.path = path;
    this.title = title;
    this.color = undefined;
    this.maxPixels = undefined;
    this.imageLoaded = false;

    this.init = function(){
        var canvas = document.querySelector("canvas");
        var img_Color = new Image_Processing_Color(canvas);
        var img = new Image();
        var info_image = this;
        img.onload = function () {
            img_Color.init(img);
            info_image.color = img_Color.getDominantColor();
            info_image.maxPixels = img_Color.getDominantColorPixels();
            info_image.imageLoaded = true;
        };
        img.src = path;
    };

    this.isImageLoaded = function(){
        return this.imageLoaded;
    }

    this.getPath = function(){
        return this.path;
    };

    this.getTitle = function(){
        return this.title;
    };

    this.getColor = function(){
        return this.color;
    };

    this.getMaxPixels = function(){
        return this.maxPixels;
    };

    this.init();
}