Méthode différente pour jQuery.load(); Pour autoriser une méthode d'arrêt sur le processus de chargement

Question

Ceci est ma première question ici, et je n'ai pas trouvé de questions connexes qui semblent avoir le même problème. J'ai trouvé quelques personnes parlant de .bind() pour désactiver un lien, mais mon problème est d'avoir plusieurs liens qui sont dans différentes parties du site en chargeant des pages différentes. Donc je me demande s'il y a une méthode de chargement ajax simple que je pourrais utiliser qui a une option d'arrêt et de compensation de ce qui était en train de charger, si un autre lien est cliqué pour charger quelque chose d'autre. Je le fais par mesure de précaution pour les personnes impatientes là-bas sur le web. Depuis, appeler une charge sur un div puis appeler une autre charge sur la même div entraîne parfois le chargement de la première charge plus long et finit par charger après le chargement de la seconde.

C'est ce que j'utilise pour le moment.

$('#content').empty().load(event.value, function() { //callback });

Je suis assez sûr qu'il n'y a pas moyen d'arrêter une méthode .load() une fois qu'il est appelé, donc est-il une autre méthode de chargement qui il peut être arrêté?

Answer 1

@tvanfosson: Je pense que votre code est un peu au-dessus de ma tête. Et je ne semble pas complètement comprendre comment l'implémenter. J'aurais probablement dû poster plus de code pour vous permettre d'expliquer ce qui se passerait.

Mais j'ai juste trouvé une manière différente de tuer la méthode load().

Je cours la plupart du site d'une page avec SWFAddress.js qui fait des changements quand l'URL change. Donc, chaque fois que mon URL change de nouvelles charges de contenu dans.

$.address.change(function(event) { 
    rand = Math.floor(Math.random()*1000); 

    $('#content').empty().append('<div id="loading'+$rand+'"></div>'); 
    $('#loading'+$rand).empty().load(event.value, function(data) { /*callback*/ }); 
}); 

J'ajoute maintenant une nouvelle div à mon div contenu qui a un identifiant aléatoire et je charge le contenu dans cette nouvelle div. De cette façon, aucune méthode de charge ne peut se chevaucher ou se produire en même temps.

Jusqu'à présent, cela fonctionne à merveille. Voyez-vous une raison pour laquelle cela pourrait être un problème?

Answer 2

Vous pouvez conserver quelque chose comme un numéro de séquence dans les données associées au conteneur. Incrémenter le numéro de séquence chaque fois que le chargement est appelé, puis vérifier dans le rappel si le numéro de séquence est inférieur ou égal au numéro de séquence attendu avant de charger réellement les données. Dans ce scénario, vous utiliseriez get au lieu de charger car vous séparez la récupération des données de l'injection du contenu.

$('#content').empty().each(function() { 
    var $this = $(this); 
    var seq = $this.data('seq') || 0; 
    $this.data('seq',++seq); 
    $.get(event.value, function(data) { 
     var newSeq = $this.data('seq'); 
     if (seq >= newSeq) { // ignore if a later request has been made 
      $this.html(data); 
     } 
    }); 
}); 

Answer 3

Voir cette autre entrée pour la gestion des demandes ajax:

Abort Ajax requests using jQuery