在所有先前的ajax调用完成后触发ajax调用

Question

可以说我有如下功能：

function A(){
    func B();
    ajax call last;
}

func B(){
   if some condition1
       func C();
   if some condition2
       func D();
   if some condition3
       func E();
}

func C(){
     some ajax cal 1
}

func D(){
     ajax call 2
}

func E(){
     ajax call 3
}

我的问题是，仅当所有先前的ajax调用均已完成时才应触发ajax调用last，即ajax调用1、2、3。

Answer 1

如果您使用的是jQuery，则可以基于promise来访问各种调用。 调用$.ajax返回一个promise ，可用于推迟后续调用。 调用when请参阅jQuery的文档（ 此处为docs）。

在$.ajax调用完成后when执行函数when使用。 您可以对$.ajax这样的单个调用或多次调用使用相同的技术。

根据您的问题，我不确定您要如何链接这些呼叫，但这是根据您的代码进行的尝试（未经测试，但这应该可以使您走上正确的轨道）：

func B()
{
    var callC = null;
    var callD = null;
    var callE = null;

    if (condition1)
        callC = $.ajax("/call/1");

    if (condition2)
        callD =  $.ajax("/call/2");

    if (condition3)
        callE =  $.ajax("/call/3");

    $.when(callC, callD, callE).then($.ajax("/call/last"));
}

.then将在3个AJAX调用完成后执行 ，无论它们成功与否。 如果只想在所有调用都返回成功后继续，则还要查看.done 。

Answer 2

尝试利用return ， .then()

function A() {
    return B();
}

function B() {
   if (some_condition1) {
       return C();
   };
   if (some_condition2) {
       return D();
   };
   if (some_condition3) {
       return E();
   };
}

function C() {
     // some ajax call 1
     return $.ajax()
}

function D() {
     // ajax call 2
     return $.ajax()
}

function E() {
     // ajax call 3
     return $.ajax()
}

A().then(function() {
  // ajax call last;
  return $.ajax()
});