将变量传递给jQuery AJAX成功回调中的函数

Question

我正在尝试通过jQuery AJAX调用预加载一些图像，但是在将（url）字符串传递到AJAX调用的成功函数内的函数时遇到了实际问题（如果有意义）。

这是我的代码，原样：

//preloader for images on gallery pages
window.onload = function() {
    setTimeout(function() {     
        var urls = ["./img/party/"]; //just one to get started

        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                success: function(data,url) {
                    $(data).find("a:contains(.jpg)").each(function(url) {                               
                        new Image().src = url + $(this).attr("href");
                    });
                }
            });
        };  
    }, 1000);
};

可以看到我（失败的）尝试将url传递到.each()调用中-
url最终得到了递增整数的值。不确定为什么或与这些东西有什么关系，也许是jpg文件的数量？

…无论如何，它当然应该在我原始的urls数组中使用单个值。

感谢您的帮助-我似乎总是对这些回调有点不满意。

程序？

所以，我有点混了，听了@ron tornambe和@PiSquared的评论，目前在这里：

//preloader for images on gallery pages
window.onload = function() {
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"];

    setTimeout(function() {
        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                success: function(data) {
                    image_link(data,i);
                    function image_link(data, i) {
                        $(data).find("a:contains(.jpg)").each(function(){ 
                            console.log(i);
                            new Image().src = urls[i] + $(this).attr("href");
                        });
                    }
                }
            });
        };  
    }, 1000);       
};

我尝试将image_link(data, i)here
放在任何地方（在每个嵌套函数等中），但得到的结果是相同的：for的值i只记录为3。我怀疑这是因为所有引用都i指向同一个事物并且由时间异步任务实际获取到image_link(data, i)的for...循环是完全断绝了（因此具有值为3）。不用说这给出urls[i]了“未定义”。

还有（更多）技巧可以解决这个问题吗？

Answer 1

由于设置对象与该ajax调用相关联，因此您可以简单地将索引器添加为自定义属性，然后可以this在成功回调中使用以下属性进行访问：

//preloader for images on gallery pages
window.onload = function() {
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"];

    setTimeout(function() {
        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                indexValue: i,
                success: function(data) {
                    image_link(data , this.indexValue);

                    function image_link(data, i) {
                        $(data).find("a:contains(.jpg)").each(function(){ 
                            console.log(i);
                            new Image().src = urls[i] + $(this).attr("href");
                        });
                    }
                }
            });
        };  
    }, 1000);       
};

编辑：
添加了一个更新的JSFiddle示例，因为他们似乎已经更改了其ECHO端点的工作方式：https
://jsfiddle.net/djujx97n/26/ 。

要了解其工作原理，请参见ajaxSettings对象上的“
context”字段：http
://api.jquery.com/jquery.ajax/ ，特别是以下注意事项：

“this所有回调中的引用是context选项中设置中传递给$ .ajax的对象；如果未指定context，则是对Ajax设置本身的引用。”