Question

我有一个ajax请求，它返回一堆URL，我创建了像

这样的图像

<img URL="1" />
<img URL="1" />
<img URL="2" />
<img URL="1" />
<img URL="3" />
<img URL="2" />

等...

我需要将它们存储为URL =“1”，因为我需要对getURLfromID进行单独的ajax请求，我将其输入“1”并且成功时它将返回文件路径“folder / folder / image.jpg”，其中然后我分配给正确的img标签

问题是如果我有1000个带有URL =“1”的imgs，它会在获得其中一个的响应之前向getURLfromID（“1”）发出1000个请求

编辑：URL =“x”将始终为相同的URL值提供相同的文件路径

我有办法吗

var URLs = {}
function setURL(imgObj, URL) {
    if(URL not in URLs) {
        $.ajax({
            url: "getURLfromID",
            data: {url: URL},
            success: function(filePath) {
                URLs[URL] = filePath
                $(imgObj).attr("src", filePath)
            }
        })
    } else {
        wait for URLs[URL] to obtain a value...
        $(imgObj).attr("src", URLs[URL])
    }
}

具体是else中的最后一位，它等待一个ajax发出请求，然后可以将所有img标签'attr分配给同一个src

注意：当我打开console =＆gt;网络时，我会看到相同网址的xhr请求数吨（禁用 - 禁用缓存）

Answer 1

尝试

$(function() {
  $('img[URL="1"]').each(function () {   
    $(this).attr('src','newurl');
  });
});

Answer 2

谢谢@Blesson，我接受了你的想法，这就是我做的事情

var setImageAjax = [];
var setImageObjects = [];
// Sets  image to the image of the id attr
function setImage(imageObj, id) {
    if(!$(imageObj).attr("src")) {
        if (!(id in setImageObjects)) {
            setImageObjects[id] = new Array()
        }
        if (!(id in setImageAjax)) {
            setImageAjax[id] = false;
        } else if (setImageAjax[id] != false && setImageAjax[id] != true) {
            $(imageObj).attr("src", setImageAjax[id]);
            return
        }
        if (setImageAjax[id] == false) {
           setImageAjax[id] = true
           $.ajax({
                url: "urlurlurl",
                method: "GET",
                data: {
                    id: id
                },
                success: function(data) {
                    setImageAjax[id] = data;
                    while(setImageObjects[id].length) {
                        $(setImageObjects[id].pop()).attr("src", data);
                    }
                }
           })
        } else {
            setImageObjects[id].push(imageObj);
        }

    }
}

jQuery Ajax加载了许多相同的东西

2 个答案: