javascript - Ajax 调用 JQuery 中的 MongoDB 查询每个循环都会影响结果的顺序

Question

我正在尝试运行 AJAX 调用，该调用执行 mongoDB 查询并在 JQuery 每个循环中返回排序结果。排序的数据库结果不会以正确返回的顺序附加到列表中。一些将 has_users 设置为 true 的结果会附加到列表中的错误位置。如果我删除对 AJAX/MongoDB 功能的 itemQuery() 函数调用，列表项将以正确的排序顺序附加。知道我做错了什么吗？

$.each(items, function (i, item) {
    //itemQuery() holds ajax call that runs mongoDB query and returns sorted results
    itemQuery(item._id).done(function(data) {
        if (data.length > 0) {
            has_users = true;
        } else {
            has_users = false;
        }

        listItem = buildListItem(item, has_users);
        $('#list_dropdown').append(listItem);
    });

}); 

Answer 1

某些 Ajax 调用先于其他调用完成，因此您会得到错误的顺序。您可以使用$.map()而不是 $.each()，返回一个 Promise，并使用 $.when()等待所有 promise 完成，然后追加元素。

你的代码可能是这样的:

$.when(
  $.map(items, function (i, item) {
    //itemQuery() holds ajax call that runs mongoDB query and returns sorted results
    return itemQuery(item._id).done(function(data) {
        if (data.length > 0) {
            has_users = true;
        } else {
            has_users = false;
        }

        return buildListItem(item, has_users);
    });
  })
).then(function (elements) {
  $('#list_dropdown').append(elements);
});