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