使用jQuery对多个元素逐个调用函数，而不是一次调用

Question

假设我使用$.get接收一组用户ID。

然后，让我们假设我要遍历所有这些用户ID(例如: 13、14、15、23、34、56)，并检索每个用户ID的特定信息，然后根据结果填充一个文本字段，然后转到下一个。

$.each(array_of_users, function(i, id) {
    $.get("/somefunction", {id}, function(data){
         appendToField(data);
    }, "json");
});

我如何才能让这些循环不会同时发生，然后像现在一样，一个接一个地异步等待结果？也就是说，我希望停止循环转到下一个元素，直到ajax请求表明可以这样做。

在不使用延迟或超时，而是使用来自执行处理的函数的实际响应的情况下，最好的方法是什么？

干杯

编辑：“命令提示符”外观的时尚表示对我来说很重要，这就是为什么我希望文本区域在处理条目时一个接一个地接收消息。我知道我可以通过PHP更容易地做到这一点，而且没有麻烦或潜在的JS中断，但我想通过JS时尚地完成它，以模拟这种“控制台”外观，如下所示：

10:01:33: User 13已处理:过期日期更改为2011年2月13日。

10:01:34:未处理用户16 :免疫系统更改的目标。

10:01:34:未处理用户17 :免疫系统更改的目标。

10:01:35: User 23已处理:过期日期更改为19.02.2011。

等等。

Edit2：

我刚刚发现了一个很棒的小插件，它可以让我做我想做的事情。但是，一旦队列启动，我找不到停止队列的方法。这现在是一个新问题。有没有人有什么想法？重新加载页面是很自然的，但我希望它在我点击停止按钮后立即冻结，这样用户就可以简单地将整个报表从文本字段中复制出来。

Answer 1

基本上，使用第一个.get()来检索值列表(array_of_users)。使用这个列表，将它们传递给一个"worker“函数，该函数接受第一个元素，处理它，然后发送剩余的元素来做同样的事情。继续操作，直到没有更多的条目需要处理。(可以把它想象成一个FIFO队列)

$.get('/loadfunction',{},function(data){
  getinfo(data.array_of_users);
},'json');

function getInfo(array_of_users){
  if (array_of_users.length == 0)
    return;

  $.get('/somefunction',{array_of_users[0]},function(data){
    // handle the result of this id
    appendToField(data);

    // move on through the list, dropping the first element
    getInfo(array_of_users.slice(1));
  });
}

编辑:使用的变量/获取路径类似于您在初始问题中提到的。

Answer 2

与其返回数组编号，然后重新向服务器查询每个id的更多信息，为什么不返回一个对象数组呢？例如：

[
  {"id":1, "uname":"jsmith", "admin":true},
  {"id":2, "uname":"jdoe", "admin":false}
]

使用PHP的json_encode函数很容易做到这一点。当您的JavaScript获得对象数组时，它将拥有循环的每次迭代所需的所有数据。

Answer 3

我同意jsummers的观点。一次下载所有信息可能比单独发送请求更好。也就是说，您可以在async: false中使用$.ajax来做您想做的事情

$.each(array_of_users, function(i, id) {
    $.ajax({
      url: "/somefunction",
      data: {id: id},
      dataType: 'json',
      type: 'get',
      async: false,
      success: function(data){
         appendToField(data);
      }
    });
});