ホームページ ウェブフロントエンド jsチュートリアル jQuery は、page_jquery 上のすべての Ajax リクエストを監視するメソッドを実装します。

jQuery は、page_jquery 上のすべての Ajax リクエストを監視するメソッドを実装します。

May 16, 2016 pm 03:26 PM
アヤックスリクエスト jquery モニター

この記事の例では、jQuery がページ上のすべての Ajax リクエストの監視を実装する方法について説明します。参考のために皆さんと共有してください。詳細は次のとおりです:

このような問題に遭遇したことはありますか?ページは 2 つの ajax リクエストを開始し、別のアクションを実行する前にそれらが成功することを期待していますか?

考えられる簡単な解決策は、一方が終了するのを待ってからもう一方を開始することです。このプロセスはコールバック関数を使用して完了します。

しかし、Ajax リクエスト コードの 1 つが自分で作成したものではなく、変更できない場合はどうすればよいでしょうか?

言い換えれば、特定の URL リクエストがいつ終了するかを知りたいだけで、他のリクエストについては気にしたくないのです。

<!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>

ログイン後にコピー

その他の関連機能:

$.ajax:

error: エラーが発生したときに呼び出され、誤ったリクエストを報告するために使用できます。
complete: 成功または失敗に関係なく呼び出されます

上位バージョン:

$.promise
$.when

この記事が jQuery プログラミングのすべての人に役立つことを願っています。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

jQueryでPUTリクエストメソッドを使用するにはどうすればよいですか? jQueryでPUTリクエストメソッドを使用するにはどうすればよいですか? Feb 28, 2024 pm 03:12 PM

jQueryでPUTリクエストメソッドを使用するにはどうすればよいですか?

jQueryで要素の高さ属性を削除するにはどうすればよいですか? jQueryで要素の高さ属性を削除するにはどうすればよいですか? Feb 28, 2024 am 08:39 AM

jQueryで要素の高さ属性を削除するにはどうすればよいですか?

jQuery のヒント: ページ上のすべての a タグのテキストをすばやく変更する jQuery のヒント: ページ上のすべての a タグのテキストをすばやく変更する Feb 28, 2024 pm 09:06 PM

jQuery のヒント: ページ上のすべての a タグのテキストをすばやく変更する

jQuery を使用してすべての a タグのテキスト コンテンツを変更する jQuery を使用してすべての a タグのテキスト コンテンツを変更する Feb 28, 2024 pm 05:42 PM

jQuery を使用してすべての a タグのテキスト コンテンツを変更する

Laravel 監視エラー: アプリケーションの安定性を向上させる Laravel 監視エラー: アプリケーションの安定性を向上させる Mar 06, 2024 pm 04:48 PM

Laravel 監視エラー: アプリケーションの安定性を向上させる

ひまわりリモコンは監視されますか?ひまわりリモコンでプライバシーが明らかになりますか? ひまわりリモコンは監視されますか?ひまわりリモコンでプライバシーが明らかになりますか? Mar 15, 2024 pm 05:28 PM

ひまわりリモコンは監視されますか?ひまわりリモコンでプライバシーが明らかになりますか?

jQuery における eq の役割と応用シナリオを理解する jQuery における eq の役割と応用シナリオを理解する Feb 28, 2024 pm 01:15 PM

jQuery における eq の役割と応用シナリオを理解する

jQuery 要素に特定の属性があるかどうかを確認するにはどうすればよいですか? jQuery 要素に特定の属性があるかどうかを確認するにはどうすればよいですか? Feb 29, 2024 am 09:03 AM

jQuery 要素に特定の属性があるかどうかを確認するにはどうすればよいですか?

See all articles