Déclenchement de l'événement ajaxStop de jQuery en cas d'appel abandonné

Question

J'ai utilisé ajaxSend et ajaxStop de jQuery pour afficher un compteur lorsque les requêtes ajax sont actives. Cela fonctionne sauf quand certains de mes plugins abandonnent leurs requêtes ajax, ajaxStop ne se déclenche pas et ne se déclenche qu'après l'actualisation de la page. Il semble que la requête avortée compte toujours pour jQuery. Puis-je effectuer un déclenchement ajaxStop ou existe-t-il un meilleur moyen?

Answer 1

Eh bien, j'ai trouvé une façon que j'aime bien. Corrigez la méthode d'abandon XMLHttpRequest afin qu'elle diminue le compteur ajax de jQuery et déclenche le gestionnaire si c'est la dernière requête. Je ne sais pas encore comment cela fonctionnera à travers les navigateurs.

var old_abort = XMLHttpRequest.prototype.abort; 
XMLHttpRequest.prototype.abort = function(){ 
    jQuery.proxy(old_abort, this)(); 
    if (jQuery.active-- === 1) 
     jQuery.event.trigger("ajaxStop"); 
}; 

Answer 2

Je voudrais utiliser l'événement complete au lieu - qui fonctionne peu importe:

complète (Local Event)
Cet événement est appelé quel que soit si la demande a réussi ou non. Vous recevrez toujours un rappel complet, même pour les demandes synchrones.

$.ajax({ 
    complete: function(){ 
    // hide your spinner 
    } 
}); 

ne sais pas si vous avez besoin, mais vous peut déclencher l'événement ajaxStop. $(this).trigger('ajaxStop');

Answer 3

Cela semble être un problème que dans jQuery 1.4.2 dataType = "JSON", voir http://forum.jquery.com/topic/ajaxstart-not-fired-when-jquery-active-changes-from-0-to-1

Mise à jour vers jQuery 1.5.1 ou appliquez le correctif publié par Jake ci-dessus. En outre, j'ai dû modifier le correctif comme suit avant de fonctionner correctement pour mes cas d'utilisation:

f_abort = XMLHttpRequest.prototype.abort; 
XMLHttpRequest.prototype.abort = function() { 
    $.proxy(f_abort, this)(); 
    if ($.active === 1) { 
    $.event.trigger("ajaxStop"); 
    $.active = 0; 
    } else if ($.active > 1) { 
    $.active--; 
    } 
};