如何在ajax响应中对多个函数使用回调

时间:2013-10-08 05:47:51

标签: javascript jquery

我的javascript代码加载器隐藏有问题,但它应该隐藏在最后一个jax响应上。

function reverseGeocoding(lat,lng, callback){
    var url = 'http://open.mapquestapi.com/nominatim/v1/reverse?format=json&lat=' + lat + '&lon=' +lng+' &zoom=18&addressdetails=1';
    $.ajax({
        url: url,                       
        crossDomain:true,
        success: function(response){
               fn1(response,mapobject);   //takes 30 seconds
               fn2(response,mapobject);   //takes 10 seconds
               fn3(response,mapobject);   //takes 30 seconds
               fn4(response,mapobject);   //takes 20 seconds
               fn5(response,mapobject);   //takes 30 seconds
               fn6(response,mapobject);   //takes 30 seconds
               fn7(response,mapobject);   //takes 40 seconds
               $("#loader").show();

        }
    });

}

但问题是装载机显示响应后。我想在所有函数调用fn1,fn2,fn3,fn4,fn5,fn6,fn7之后显示加载器。请帮忙

2 个答案:

答案 0 :(得分:2)

您可以使用$.Deffered,特别是$.when$.then。假设您在执行$.ajax请求的所有功能中,它们应如下所示:

function f1() {
    return $.ajax({
        url: "someUrl",
        success: function (data) {
            console.log("f1 done")
        }
    });
}

此类函数将返回promise,然后可以使用$.when将其放入回调中:

 $.when(f1(), f2(), f3()).then(function () {
     console.log("all done!");
 });

Fiddle sample

答案 1 :(得分:2)

你可以使用jquery延迟对象。

http://api.jquery.com/deferred.done/

var dfd = $.Deferred();

    dfd
        .done( [ fn1, fn2 ], fn3, [ fn2, fn1 ] )
        .done(function( n ) {
            $( "p" ).append( n + " we're done." );
        });