JQuery($.load)の使い方と解析についてevent_jquery

まず、jquery ロード メソッドは、便宜上 jQuery.ajax() をカプセル化するメソッドであることを明確にする必要があります。より複雑なロジックを処理する必要がある場合でも、jQuery の比較を使用する必要があります。包括的なアプローチの .ajax() 。

load メソッドを呼び出すための完全な構文形式:load( url, [data], [callback] )
ここで: url は、インポートされるファイルのアドレスを指します。
data: オプションのパラメータ。load では静的 HTML ファイルだけでなく、PHP ファイルなどの動的スクリプトもインポートできるため、動的ファイルをインポートする場合は、ここに渡すパラメータを指定できます。
callback: オプションのパラメータ。load メソッドを呼び出してサーバーから応答を取得した後に実行される別の関数を指します。

いくつかの使用例を以下に示します:

1. 渡すパラメータを含まない PHP ファイルをロードします

コードをコピーします コードは次のとおりです:

$("#myID").load("/test.php");//ID #myID の要素に test.php をインポートした結果

2. 受け渡しパラメータを含む PHP ファイルをロードします

コードをコピーします コードは次のとおりです。

$("#myID").load("/test.php",{"name":"Adam"});//インポートされた php ファイルには、次のような渡しパラメータが含まれています。リクエスト URL: /test.php?name=Adam

3. 渡された複数のパラメーターを含む PHP ファイルをロードします。注: パラメータはカンマで区切ります

コードをコピーします コードは次のとおりです:

$( "#myID").load("/test.php",{"name":"Adam","site":"www.lhy-seo.com"});//インポートされたphpファイルリクエスト url:/test.php?name=Adam&site=www.phpernote.com

と同様の、引き渡しパラメータが含まれています。

4. 配列を渡すパラメーターとして使用する PHP ファイルをロードします

コードをコピーしますコードは次のとおりです:

$("#myID").load("/test.php",{'myinfo[]', ["Adam", "www.lhy-seo. com" ]});//インポートされた php ファイルには、パラメータを渡す配列が含まれています。

注: ロードを使用する場合、これらのパラメータは POST で渡されるため、/test.php では GET を使用してパラメータを取得することはできません。

5. コールバックの使用方法 たとえば、load メソッドがサーバーの応答を取得した後に、ロードされたコンテンツをゆっくり表示したい場合は、コールバック関数を使用できます。 コードは次のとおりです:

コードをコピーします コードは次のとおりです:

$("#go" ).click(function(){
$("#myID").load("welcome.php", {"lname":"Cai", "fname":"Adam", function(){
$("#myID").fadeIn('slow');}
);
});

6. ページフラグメントをロードします

.load() メソッドを使用すると、リモート ドキュメントの特定の部分を挿入するよう指定できます。これは、URL パラメーターの特別な構文によって実現されます。文字列に 1 つ以上のスペースが含まれている場合、最初のスペースに続く文字列が、ロードされる内容を決定する jQuery セレクターになります。例:

コードをコピー コードは次のとおりです:

$("#result" ).load( "/test.html #container");

7. jquery の読み込みでキャッシュを使用しないようにする方法

キャッシュによりページの読み込みはある程度高速化されますが、多くの場合問題が発生します。実際のアプリケーションでは、ブラウザのキャッシュの問題が発生する可能性があります。たとえば、IE7 でこの問題が発生しました。

コードをコピー コードは次のとおりです。

$(document).ready(function( ){
$("#labels").load("/test.html");
//ページがロードされたら、test.html のコンテンツを ID #labels の DOM 要素に挿入します。
} );

test.html を更新した後、IE7 のロード メソッドは古い test.html を使用したままになり、更新キーを押しても機能しません。幸いなことに、jQuery には、ajax によるキャッシュの使用を防ぐメソッドが用意されており、次のステートメントをヘッド JavaScript ファイルに追加して問題を解決します。

コードをコピー コードは次のとおりです。

$.ajaxSetup({
cache : false / /AJAX 対応キャッシュを閉じる
});

さらに、キャッシュの問題を解決するいくつかの方法を紹介します。注: jQuery の読み込みの問題についてはテストしていません。これらのメソッドは参照のみを目的としています。

1. test.html を label_new.html に変更するなど、ファイル名を変更します。ただし、これは簡単な作業であり、通常は誰も行いません。

2. test.html の後に特定の時刻を追加します (例: test.html?20081116)。実際の作業では、css/javascript ファイルを更新した後、ファイルがキャッシュされないようにするために常にこの方法を使用しています。

3. test.html ファイルの先頭に次のステートメントを追加します。

コードをコピーします コードは次のとおりです。

さらに、jquery ロードを使用する場合は、次の点に注意する必要があります:

(1) ウィンドウ オブジェクトにバインドされている場合、ウィンドウ、フレーム、オブジェクト、画像を含むすべてのコンテンツが読み込まれた後にトリガーされます。要素にバインドされている場合、要素のコンテンツが読み込まれるときに起動されます。

(2) この要素が完全にロードされる前にロード処理関数がバインドされている場合にのみ、ロード処理関数はロード後にトリガーされます。後でバインドすると、トリガーされなくなります。したがって、$(document).ready() でロード イベントをバインドしないでください。jQuery は、すべての DOM ロードが完了した後にロード イベントをバインドするからです。

(3) jQuery はブラウザの .innerHTML 属性を使用して、取得したドキュメントを解析し、現在のドキュメントに挿入します。このプロセス中に、ブラウザーは多くの場合、、