如何在繼續執行.done（）之前完成

Question

我想在.done()的所有內容完成後執行$(".foo").fadeIn("slow");。

現在，無論何時調用fadeIn，我仍然可以看到文本如何進行實時更改，因爲jQuery不會等到它完成。

我該怎麼做呢？

$(".notice").fadeOut("slow", function() { 
    $.ajax({ 
     url: "http://graph.facebook.com/name", 
     cache: false, 
     dataType: "JSON" 
    }) 
    .done(function(data) { 
     $(".foo .bar").text(data.name); 
    }); 
    $(".foo").fadeIn("slow"); // 
}); 

Answer 1

把你的代碼jQuery.done方法的回調內部

$(".notice").fadeOut("slow", function() { 
    $.ajax({ 
     url: "http://graph.facebook.com/name", 
     cache: false, 
     dataType: "JSON" 
    }) 
    .done(function(data) { 
     $(".foo .bar").text(data.name); 

     $(".foo").fadeIn("slow"); // 
    }); 

}）;

Answer 2

移動到你的Ajax的功能實現：

$(".notice").fadeOut("slow", function() { 
    $.ajax({ 
     url: "http://graph.facebook.com/name", 
     cache: false, 
     dataType: "JSON" 
    }) 
    .done(function(data) { 
     $(".foo .bar").text(data.name); 
     $(".foo").fadeIn("slow"); //move it here and it will be called if your ajax request is ready 
     callMethod(); //alternative you can call a mehtod 
    }); 
}); 

function callMethod() { 
    $(".foo").fadeIn("slow"); 
} 

Answer 3

您可以使用chain of done：

$.ajax({ 
    url: "http://graph.facebook.com/name", 
    cache: false, 
    dataType: "JSON" 
}).done(function(data) { 
    $(".foo .bar").text(data.name); 
}).done(function() { 
    $(".foo").fadeIn("slow"); 
}); 

DEMO.