1

我正在尝试编写在单击缩略图后使用 ajax 加载多个图像的代码。load 方法包含在一个 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 开头：/

提前感谢您的帮助，我一直在尝试解决这个问题

4

1 回答 1

0

更新

您可以使用此功能检查喜欢existence，file

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);
    }
}
于 2013-06-24T05:21:58.493 回答