jQuery implémente la méthode de surveillance de toutes les requêtes ajax sur la page

Maison

interface Web

js tutoriel

jQuery implémente la méthode de surveillance de toutes les requêtes ajax sur la page_jquery

May 16, 2016 pm 03:26 PM

ajax请求 jquery 监控

L'exemple de cet article décrit comment jQuery implémente la surveillance de toutes les requêtes ajax sur la page. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Avez-vous déjà rencontré un tel problème : la page initie deux requêtes ajax, en espérant qu'elles aboutissent avant d'entreprendre une autre action ?

La solution simple à laquelle penser est d'attendre la fin de l'un d'entre eux avant de lancer l'autre. Ce processus est complété à l'aide d'une fonction de rappel.

Cependant, que devez-vous faire si l'un des codes de requête ajax n'est pas écrit par vous et que vous ne pouvez pas le modifier ?

En d’autres termes, vous voulez simplement savoir quand une certaine requête d’URL se termine et vous ne voulez pas vous soucier des autres requêtes. Comment faire cela ?

&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;p id="test"&gt;&lt;/p&gt;
  &lt;/body&gt;
  &lt;script src="js/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;!--首先在页面引入jquery的后面，紧接着以下代码：--&gt;
  &lt;script&gt;
    //前提：所有ajax请求都是用jquery的$.ajax发起的，而非原生的XHR；
    var ajaxBack = $.ajax;
    var ajaxCount = 0;
    var allAjaxDone = function(){$('#test').append('all done!&lt;br&gt;');} //一行代码，就可以知道所有ajax请求什么时候结束
    //由于get/post/getJSON等，最后还是调用到ajax，因此只要改ajax函数即可
    $.ajax = function(setting){
      ajaxCount++;
      var cb = setting.complete;
      setting.complete = function(){
        if($.isFunction(cb)){cb.apply(setting.context, arguments);}
        ajaxCount--;
        if(ajaxCount==0 && $.isFunction(allAjaxDone)){
          allAjaxDone();
        }
      }
      ajaxBack(setting);
    }
  &lt;/script&gt;
  &lt;!--以下是别人的script--&gt;
  &lt;script&gt;
    $.ajax({url: 'js/jquery-1.11.0.min.js', success: function(recv){$('#test').append('别人的ajax请求1，done&lt;br&gt;')}});
  &lt;/script&gt;
  &lt;script&gt;
    $.get('css/main.css', null, function(recv){$('#test').append('别人的get请求，done&lt;br&gt;')});
  &lt;/script&gt;
  &lt;script&gt;
    $.post('css/main.css', null, function(recv){$('#test').append('别人的post请求，done&lt;br&gt;')});
  &lt;/script&gt;
&lt;/html&gt;

Copier après la connexion

Autres fonctions associées :

$.ajax :

error : Appelé lorsqu'une erreur se produit et peut être utilisé pour signaler des demandes erronées.
complet : appelé indépendamment du succès ou de l'échec

Version haute :

$.promesse
$.quand

J'espère que cet article sera utile à tous ceux qui programment jQuery.

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn