Abortant jQuery (). Load ()

La fonction .load() de la bibliothèque jQuery vous permet de charger sélectivement des éléments d'une autre page (sous réserve de certaines règles). J'aimerais savoir s'il est possible d' annuler le processus de chargement.

Dans notre application, un utilisateur peut parcourir une liste d'articles. Ils peuvent choisir de cliquer sur un bouton qui charge et affiche des informations supplémentaires sur un élément d'un autre document (ce qui peut prendre un certain temps). S'ils choisissent un élément différent dans la liste tandis que .load() se produit encore, j'aimerais que le chargement soit interrompu.

Est-ce possible? Cela en vaut-il même la peine? Des idées?

Dan

Vous ne pouvez pas le faire avec .load() directement, puisqu'il renvoie l'objet jQuery pour le chaînage, mais si vous passez à l' $.ajax() avec .html() vous pouvez, comme ceci:

 var xhr = $.ajax({ url: 'mypage.htm', success: function(data) { $("#myElement").html(data); } }); //if needed, abort the request later.. xhr.abort(); 

Cela utilise la méthode .abort() sur l'objet XMLHttpRequest pour annuler la charge.

La réponse de Nick était presque ce dont j'avais besoin, mais pas tout à fait. J'utilisais .load () pour charger uniquement une image d'une page. Alors, en développant la réponse de Nick …

Donc au lieu de …

 $('#myElement').load('mypage.htm #myImage'); 

J'utilise maintenant …

 var xhr = $.ajax({ url: 'mypage.htm', success: function(data) { $("#myElement").html($(data).find("#myImage")); } }); //if needed, abort the request later.. xhr.abort(); 

Vous pouvez le faire en utilisant jQuery.ajax manuellement. Il renverra un objet XMLHttpRequest , que vous pouvez appeler abort si nécessaire. Dans le gestionnaire de réussite, vous pouvez utiliser jQuery.html

 $("#myElement").load("/mypage #mayImage", function(response, status, xhr) { if (status == "error") { xhr.abort(); } }); 

Doit fonctionner comme ça …

Ou sur un autre événement, j'envoie une vérification sur un long champ, l'utilisateur modifie le contenu, je souhaite arrêter le contrôle précédent pour vérifier de nouveau:

 xhr.abort(); $("#myElement").load("/mypage #mayImage", function(response, status, xhr) { if (status == "error") { xhr.abort(); } });