多个异步jQuery AJAX POST同时返回

Question

我正在用 PHP 开发一个应用程序，有时该应用程序必须创建多个 AJAX POST（每个都返回少量 HTML）。这些 POST 中的每一个都必须在 div 中插入返回的 HTML。我这样做没有问题，但是当我一次启动所有 AJAX POST（假设我启动 10 个）时问题就来了，我为每个 POST 指定了一个单独的 div。因为它们都是异步的，并且它们都在几乎完全相同的时间返回所有 HTML 最终都在一个 div 中，而不是每个单独的 div 中。我会发布一些代码来澄清。这是我的“apiCall”函数的精简版：

xhr = $.ajax({
    type: "POST",
    url: "../api.php",
    dataType: "json",
    data: data,
    success: function(data) {
      obj.html(data.D['html']);
    }
});

问题发生在成功函数附近。 data.D['html'] 包含来自 POST 的 HTML，但我认为它会被下一个 AJAX POST 覆盖，所以这就是为什么我看到的只是返回最后一个被放入 div 的 AJAX POST（这是 jQuery 的一部分我写的插件，obj是传入的div）我这样称呼它：

$("#container).apiCall({options...});

谁能提供一个解决方案，以便当这些 AJAX POST 返回时，我可以将来自该特定 POST 的返回数据放入正确的 div 中？

Answer 1

你这样做了好几次，你总是引用同一个 obj。 与此同时，你正在覆盖你的 obj.

当所有 ajax 函数都设置好并且响应开始到达（并且回调开始运行）时，所有 obj 引用都指向 obj 的最后一个值。

使用闭包将其保存在另一个变量中（在本例中为 myObj）：

xhr = (function(){
  var myObj = obj;
  return $.ajax({
      type: "POST",
      url: "../api.php",
      dataType: "json",
      data: data,
      success: function(data) {
        myObj.html(data.D['html']);
      }
  });
})();

它没有将 $.ajax() 返回的内容直接分配给 xhr，而是创建了一个匿名函数并立即调用它：( function(){ /* code */ } )()

该函数“备份” obj 到 myObj（匿名函数的本地变量），然后简单地返回 $.ajax() 返回的内容。

我没有测试这段代码。如果有任何错误，请告诉我。