jQuery()在for循环内部加载方法,如何在出现错误时退出

jQuery ()load method inside of for loop, how to exit on error?

本文关键字:错误 退出 方法 for 循环 加载 内部 jQuery      更新时间:2023-09-26

我正试图编写一段代码,在单击缩略图后用ajax加载多个图像。加载方法被包装在for循环中,因为图像被命名为my-image-1、my-image-2等。我想通过增加I来加载图像,并在/my-image-I.jpg不存在时退出循环,从而产生错误。

function load_slides(i) {
            console.log(i);
            var url = "some-url.jpg";
            var img = $('<img />').attr('src', url).load(function(response, status, xhr) {
                    if (status == "error") {
                        console.log("Error loading");
                        return false;
                    }
                });
        }
//code below is triggered upon clicking the thumbnail
for (var i = 1;; i++) {
                    if (!load_slides(i)) break;
                    else {
                        load_slides(i);
                    }
}

使用上面的代码,我从未看到错误消息,循环也从未停止执行,甚至不应该以错误的url:/开始

提前感谢您的帮助,我已经想了一段时间了

更新

您可以使用此功能检查类似file的的existence

function UrlExists(url)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status==404;
}

for (var i = 1;; i++) {
    // if UrlExists will return true then break, not found image
    url='my-image-'+i+'.jpg';
    if (UrlExists(url)) break;
    else {
       load_slides(i);//load image function calling
    }
}

来源:如何检查jQuery或JavaScript中是否存在文件?

function load_slides(i) {
    console.log(i);
    var my_status=true;
    var url = "some-url.jpg";
    var img = $('<img />').attr('src', url).load(function(response, status, xhr) {
       if (status == "error") {
          console.log("Error loading");
          my_status=false;
       }
    });
    return my_status;// return mystatus from here to check;
}
//code below is triggered upon clicking the thumbnail
for (var i = 1;; i++) {
    // if my_status will return false then break
    if (!load_slides(i)) break;
    else {
       load_slides(i);
    }
}