ajax函数成循环答案

【问题标题】：Ajax function into a loopajax函数成循环
【发布时间】：2013-04-29 09:50:36
【问题描述】：

我请求您回答我遇到的问题（部分是数组）：

for(i=1;i<part.length;i++){
    $("#content").append('<div id="id' + i + '"></div>');
    $.get('ajax.php?id=' + i, function(data) {
        console.log("cache" + i);
        $("#id" + i).html(data);
    });
});

问题是进入$.get函数，i值是循环结束时的i值。由于我的数组（部分）中有 140 行，我将永远是 140，而不是 1 然后 2 然后 3 ..

ajax回调中如何获取i值？

感谢回复。

【问题讨论】：

阅读“在循环中创建闭包：一个常见错误”部分here

标签： javascript jquery ajax loops

【解决方案1】：

或者，从服务器获取 JSON 并对其进行迭代：

$.get('ajax.php', { from: 1, to: 140 } ).done(function(data) {
    $(data).each(function(index) {
        //do something with this and index
    });
});

这样您就可以在内部访问索引，并且只会向服务器发出一个请求，因此不会污染网络。

【讨论】：

【解决方案2】：

由于 AJAX 调用是异步的，所有的回调都在循环之后运行。

您可以使用函数表达式为每次迭代创建一个单独的变量：

for(i=1;i<part.length;i++){
  $("#content").append('<div id="id' + i + '"></div>');

  (function(i){

    $.get('ajax.php?id=' + i, function(data) {
      console.log("cache" + i);
      $("#id" + i).html(data);
    });

  })(i);

});

【讨论】：

【解决方案3】：

请注意，您的循环将尝试在浏览器允许的情况下一次触发尽可能多的 AJAX 请求，但不保证它们会按任何特定顺序完成。

如果你真的必须触发 140 个 AJAX 请求，我建议改为：

var i = 1;
(function loop() {
    if (i < part.length) {
        $("#content").append('<div id="id' + i + '"></div>');
        $.get('ajax.php?id=' + i).done(function(data) {
            console.log("cache" + i);
            $("#id" + i).html(data);
            i++;
        }, loop);
     }
});

【讨论】：

【解决方案4】：

Guffa 他的回答应该有效，您也可以使用 $.ajax-version 并将 async-parameter 设置为 false。查看文档以了解如何使用它。

编辑：应该注意，尽管使用async: false 是一种不好的做法，将被弃用。

【讨论】：

async: false 是不好的做法，将被弃用
感谢您通知我，我将编辑我的答案并将您的反馈意见放入其中。
这不仅是不好的做法而且已被弃用。在某些浏览器中它根本不起作用。
嗯，每天都学点新东西。你想让我删除我的帖子吗？
哪些浏览器不支持 async=false？