jQuery多個Ajax加載調用動畫

Question

在頁面上我有不同的元素，我綁定不同的Ajax調用。 例如，一個a.click正在請求x.php，另一個向下請求y.php。

我喜歡做的是爲每個放置一個單獨的加載圖像。 ajaxStart和ajaxStop不會這樣做，因爲它們每次被觸發，無論哪個被調用。

那麼，我如何才能做到個人電話？

Answer 1

您可以在個人$.ajax調用這樣使用beforeSend和complete回調：

$.ajax({ 
    url: 'myPage1.html', 
    beforeSend: function() { 
    $("#loading1").fadeIn(); 
    }, 
    success: function(data) { 
    //Current code 
    }, 
    complete: function() { 
    $("#loading1").fadeOut('fast'); 
    } 
}); 


$.ajax({ 
    url: 'myPage2.html', 
    beforeSend: function() { 
    $("#loading2").fadeIn(); 
    }, 
    success: function(data) { 
    //Current code 
    }, 
    complete: function() { 
    $("#loading2").fadeOut('fast'); 
    } 
}); 

See here for a full list of available callbacks