Question

我有一个带有标签和网址的对象，我想用相同的密钥扩展到对象，但用通过ajax调用获得的实际内容替换网址，例如：

var requests = {
  foo: 'http://url1.com',
  bar: null,
  baz: 'http://url2.com'
}

会扩展为像

这样的对象

{
  foo: 'content 1',
  baz: 'content 2'
}

可以按任何顺序展开单个项目，但显然我想跳过对null值的ajax调用。重点是我还希望在对象完全展开后调用一个回调函数。

我想知道什么是最优雅和简单的解决方案（在jQuery中）？

谢谢！

Answer 1

您可能会使用jQuery的when()和then()函数进行ajax调用。

请注意，这仍然是 async 。同步请求会锁定您的浏览器，直到完成。因此，最优雅的解决方案是使用异步，并使用延迟/承诺。

var promises = [];
var results = {}
var requests = {
  foo: 'http://jsonplaceholder.typicode.com/posts/1',
  bar: null,
  baz: 'http://jsonplaceholder.typicode.com/posts/2'
}

function getDataForKey(key, url) {
  return $.ajax({
    url: url,
    dataType: "json",
    success: function(data) {
      document.write(key + " done<br>");
      results[key] = data;
    }
  });
}

for (var key in requests) {
  if (!requests[key]) continue;
  promises.push(getDataForKey(key, requests[key]));
}

// Apply each promise as an argument to jQuery's when() function
$.when.apply(this, promises).then(function() {
  // Here everything has finished.
  document.write("all done!<br>");
  document.write("<pre>" + JSON.stringify(results, null, "  ") + "</pre>");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

同步处理多个ajax请求

1 个答案: