jQuery melaksanakan kaedah memantau semua permintaan ajax pada page

jQuery melaksanakan kaedah memantau semua permintaan ajax pada page_jquery

WBOY

Lepaskan： 2016-05-16 15:26:19

asal

1356 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara jQuery melaksanakan pemantauan semua permintaan ajax pada halaman. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Pernahkah anda menghadapi masalah seperti itu: halaman memulakan dua permintaan ajax, dengan harapan ia akan berjaya sebelum mengambil tindakan lain?

Penyelesaian mudah untuk difikirkan ialah menunggu salah satu daripadanya tamat sebelum memulakan yang lain Proses ini diselesaikan menggunakan fungsi panggil balik.

Walau bagaimanapun, apakah yang perlu anda lakukan jika salah satu kod permintaan ajax tidak ditulis oleh anda dan anda tidak boleh mengubahnya?

Dalam erti kata lain, anda hanya ingin tahu apabila permintaan URL tertentu tamat dan tidak mahu bimbang tentang permintaan lain Bagaimana untuk melakukan ini?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <p id="test"></p>
  </body>
  <script src="js/jquery-1.11.0.min.js"></script>
  <!--首先在页面引入jquery的后面，紧接着以下代码：-->
  <script>
    //前提：所有ajax请求都是用jquery的$.ajax发起的，而非原生的XHR；
    var ajaxBack = $.ajax;
    var ajaxCount = 0;
    var allAjaxDone = function(){$('#test').append('all done!<br>');} //一行代码，就可以知道所有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);
    }
  </script>
  <!--以下是别人的script-->
  <script>
    $.ajax({url: 'js/jquery-1.11.0.min.js', success: function(recv){$('#test').append('别人的ajax请求1，done<br>')}});
  </script>
  <script>
    $.get('css/main.css', null, function(recv){$('#test').append('别人的get请求，done<br>')});
  </script>
  <script>
    $.post('css/main.css', null, function(recv){$('#test').append('别人的post请求，done<br>')});
  </script>
</html>

Salin selepas log masuk

Fungsi lain yang berkaitan:

$.ajax:

ralat: Dipanggil apabila ralat berlaku dan boleh digunakan untuk melaporkan permintaan yang salah.
lengkap: Dipanggil tanpa mengira kejayaan atau kegagalan

Versi tinggi:

$.janji
$.bila

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.