Question

我有两个函数，其中包含ajax calls。

function a(){
    ajaxCall_A();
}
function b(){
    ajaxCall_B();
}

我还有另一个函数，它按a然后b的顺序调用这两个函数。

function c(){
    a();
    b();
    // expectation : function 'b' will get executed only after function 'a' finished it's execution  
}

我不确定他们是否按照我的预期工作。有一段时间它会做，但有时它不会。我认为这是因为ajax调用是异步的，在它们内部。

如何在函数'c'中运行这两个函数来实现期望。

注意：功能如下所示

function a(){ 
    $.ajax({
        url: "url_a",
        type: "post",
        dataType: "html",               
        cache: false,
        success: function(data){             

        },
        error:function(){             

        }   
    });   
}

function b(){ 
    $.ajax({
        url: "url_b",
        type: "post",
        dataType: "html",               
        cache: false,
        success: function(data){             

        },
        error:function(){             

        }   
    });   
}

Answer 1

因为ajax调用是异步的，所以如果你希望第二个调用在第一个完成之前不启动，你需要手动对ajax调用进行排序。

Promise非常适合序列化异步操作，它们可以使它变得非常简单。幸运的是，jQuery内置了promise，并且每个Ajax操作都已经返回了一个可用于此的promise：

$.ajax(...).then(function(result1) {
    // make 2nd ajax call when the first has completed
    return $.ajax(...);
}).then(function(result2) {
    // success of both ajax calls here
}, function(err) {
    // error here
});

或者，如果你让a()和b()都从他们的ajax调用中返回jQuery ajax promise，那么你可以这样做：

a().then(b);

并且，c()可能只是：

function c() {
    return a().then(b);
}

所以，如果你想让函数调用包含这些没有a()和b()的Ajax调用，你应该让它返回一个promise：

function c() {
    return $.ajax(...).then(function(result1) {
        // make 2nd ajax call when the first has completed
        return $.ajax(...);
    })
}

然后，您可以像这样致电c()：

c().then(function(result) {
    // success here
}, function(err) {
    // error here
});

这是一个返回Ajax承诺的函数示例：

function test() {
    return $.ajax("http://www.test.com/api/test");
}

现在，您已经添加了实际的ajax代码，您只需添加一个回复：

function a(){ 
    return $.ajax({
        url: "url_a",
        type: "post",
        dataType: "html",               
        cache: false
    });   
}

function b(){ 
    return $.ajax({
        url: "url_b",
        type: "post",
        dataType: "html",               
        cache: false
    });   
}

function c() {
    return a().then(b);
}

Answer 2

确保ajaxCall_A()和ajaxCall_B()返回承诺，并将return添加到a()和b()。

function a(){
    return ajaxCall_A();
}
function b(){
    return ajaxCall_B();
}

然后，a()和b()将按如下顺序执行：

function c() {
    a().then(b);
}

您还应该向return添加c()，以便向其来电者返回承诺。

function c() {
    return a().then(b);
}

Answer 3

只需使用jQuery.when（）＆amp;完成（）延迟：

    function a() {
        var deferred = $.Deferred();

        $.ajax({
        url: "url_a",
        type: "post",
        dataType: "html",               
        cache: false,
        success: function(data){             
            deferred.resolve(data);
        },
        error:function(){             
           deferred.resolve("Error from a()");
       }   
      });  
      return deferred.promise();
    }
    function b() {
        var deferred = $.Deferred();

        $.ajax({
        url: "url_b",
        type: "post",
        dataType: "html",               
        cache: false,
        success: function(data){             
            deferred.resolve(data);
        },
        error:function(){             
           deferred.resolve("Error from b()");
       }   
      }); 

        return deferred.promise();
    }

    function c()
    {
        $.when(
            a(),
            b()
       )
      .done(function ( v1, v2 ){
      //Do your work - v1 and v2 are resolved value from a() and b() 
      });       
    }

Answer 4

允许a函数接受完成时要执行的回调参数，并将b函数作为回调发送：

function c(){
  a(b); 
}

function a(callback){ 
  $.ajax({
    url: "url_a",
    type: "post",
    dataType: "html",               
    cache: false,
    success: function(data){             
      callback() // Note here call the next function
    },
    error:function(){             

    }   
  });   
}

Answer 5

您需要使用信号量

同步它们

function c(){
    $semaphore=true;
    a();
    while($semaphore ) { 
         setTimeout("checksemaphore()", 500);
    } 
    b();
    // expectation : function 'b' will get executed only after function 'a' finished it's execution  
}


inside the ajax call to a
add a complete: 

complete : function(result) { 
            $waitsemaphore= 0 ; },
error: function(result) {alert("AJAX completed w/error");alert(result);},

依次使用Ajax调用运行两个函数

5 个答案: