javascript - jQuery 延迟对象和 AJAX 调用

Question

我处于需要使用多个 AJAX 调用创建一个表的情况。我发出一个 ajax 请求并获得一个包含元素数组的 JSON 对象(比如说 5)。通过 for 循环运行它，并在每个 ajax 请求的响应中使用来自当前循环元素和当前 ajax 调用的部分数据创建一行，然后将其添加到表的一行中。 (抱歉我的语法不好)

我想知道如何使用延迟对象来实现它？如果我的理解是正确的，那么使用延迟对象来实现应该更简单？正确吗？

我目前的实现

$.ajax{
    //options
    success : function(data){

    // add col1, col2, col3 from first ajax call
        $(data).each(function(i,e){
            
            // make ajax request based on inputs from current loop element
            $.ajax({
                //options
                success: function(data) {
                    // add col5, col6 from first ajax call
                    // add col7, col8 from current loop element
                    // add <tr> to the table
                }
            });
            
        });
    
    }
}

Answer 1

您想等到所有 ajax 调用都返回后再更新 DOM 吗？如果您不需要这样做，那么您可以不使用 $.Deferred。只需在每个“成功”回调中更新 DOM。

如果你确实想等到所有调用都返回，那么你可以这样做:

var promises = [];

$(data).each(function(i,e){

  // make ajax request based on inputs from current loop element
  promises.push($.ajax({ 
    // stuff 
  }));

});

$.when(promises).done(function() {
  // Update the DOM
});

我还没有尝试过这个，所以可能存在语法错误，但我的想法是 ajax 调用返回一个“promise”。这本质上是一种 promise ，即在未来的某个时刻，它将履行其职责。因此，您将所有 promise 放入一个数组中，然后您可以使用 $.when 函数在所有 promise 都实现时执行一些代码。