Question

我的网页中有2个部分需要单独的AJAX调用，然后在将内容注入DOM之前模拟数据。现在我正在寻找这样做的最佳方式，我一直在阅读很多关于jQuery Deferreds的文章，这么多，我不太确定最好的方法是什么。下面是我认为我会使用的代码，但我真的很感激一些输入。如果有人想对此添加一些建议，我对缓存也非常朦胧。

JS

function ajaxCall1() {
    var dfd = $.Deferred();
    return $.ajax({
        type: 'POST',
        dataType: 'json',
        url: '/url1',
        data: { },
        success: function(data) {
            // Run templating code
        }
    });
    return dfd.promise();
}

function ajaxCall2() {
    var dfd = $.Deferred();
    return $.ajax({
        type: 'POST',
        dataType: 'json',
        url: '/url2',
        data: { },
        success: function(response) {
            // Run templating code
        }
    });
    return dfd.promise();
}

$.when( ajaxCall1(), ajaxCall2() )
   .then(function(){
      // Display DOM elements
   })
   .fail(function(){
      // Display error message
   });

Answer 1

为了使用Deferreds你应该

1 - generate a new $.Deferred()
2 - return its .promise() from the function
3 - .resolve() the deferred in the callback of the Ajax request

中的某些内容

function ajaxCall1() {
   var dfd = new $.Deferred();
   $.ajax({
      ...
      success: function(data) {
         dfd.resolve(data);
      }
   });
   return dfd.promise();
}

function ajaxCall2() {
   var dfd = new $.Deferred();
   $.ajax({
      ...
      success: function(data) {
         dfd.resolve(data);
      }
   });
   return dfd.promise();
}

$.when(ajaxCall1(), ajaxCall2()).then(function(data1, data2) {
   // data1 holds the result of the first ajax call, data2 that of the second call
});

编辑：因为$ .ajax（）已经返回延迟，你可以这么做就像

function ajaxCall1() {
   return $.ajax({
      ...
   });
}

function ajaxCall2() {
   return $.ajax({
      ...
   });
}

$.when(ajaxCall1(), ajaxCall2()).done(function(data1, data2) {
   // data1 holds the result of the first ajax call, data2 that of the second call
});

通过我的AJAX调用了解如何使用jQuery Deferreds

1 个答案: