web-dev-qa-db-ja.com

jQueryを使用して完了した「任意の」ajaxリクエストを検出するにはどうすればよいですか？

出力を操作するためにjavascript/jqueryを挿入できるページがあります。ページのマークアップなどを他に制御することはできません。

ページに表示されるたびに、jqueryを介して追加の要素を追加する必要があります。問題は、$（document）.readyが完了した後に発生する既存のページの非同期呼び出しを介して要素が生成されることです。

基本的に、ページが読み込まれ、後続のajax呼び出しが完了した後にjqueryを呼び出す方法が必要です。ページ上の任意のajax呼び出しの完了を検出してから、独自に作成したカスタム関数を呼び出して、新しく作成されたの後に追加の要素を挿入する方法はありますか？

jqueryajaxloaddetect
14
Brian Scott

OPが使用していないようなので、残念ながらこれは当てはまりません$.ajax()またはコンテンツを実際にロードするための任意のjQuery ajaxメソッド。ただし、将来のグーグルがこれを行う場合に備えて、ここに残します。

ここでのニーズを満たすグローバルajaxイベントのいずれか を使用できます。おそらく $.ajaxComplete() または $.ajaxSuccess() 。

例えば：

$(document).ajaxSuccess(function() {
  alert("An individual AJAX call has completed successfully");
});
//or...
$(document).ajaxComplete(function() {
  alert("ALL current AJAX calls have completed");
});

いくつかのジェネリック関数だけを実行したい場合は、それらをドキュメントに添付します（それらは下のイベントにすぎません）。モーダルやメッセージなど、特に何かを表示したい場合は、次のように、少しきちんと使用できます（ただし、これは目的のようには見えません）。

$("#myModal").ajaxComplete(function() {
  $(this).fadeIn().delay(1000).fadeOut();
});
47
Nick Craver

この例では、jQueryを使用したajax呼び出しの開始時と終了時に要素を表示および非表示にするだけです。

    $("#contentLoading").ajaxSend(function(r, s) {
        $(this).show();
        $("#ready").hide();
    });

    $("#contentLoading").ajaxStop(function(r, s) {
        $(this).hide();
        $("#ready").show();
    });

#contentLoadingはgif画像の進捗インジケータです。

2
Gutzofter

私が理解できるように、準備ができたハンドラーでjQueryのAjax関数を使用しています。したがって、Ajax関数が応答を受け取った後に呼び出される別の関数を渡すだけで済みます。例えば

$(document).ready(function(){
    $("#some_div").load('/some_url/', function(){
        /* Your code goes here */
    });
});
1
sanya

XMLHttpRequestオブジェクトのsend（）関数を書き換えることができます。

純粋なJavascript here を使用してそうするためのソリューションを参照してください。

1
Sébastien Brodeur

。live（） / 。delegate（） を使用できます。

0
Tgr