jQuery ajax - load() メソッド
例
AJAX リクエストを使用して div 要素のテキストを変更する：
$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});
定義と用法
load() メソッドは、AJAX リクエストを通じてサーバーからデータをロードし、返されたデータを指定された要素に配置します。
注釈：存在する名前 load の jQuery イベント方法。どちらを呼び出すかは、パラメータに依存します。
文法
load(url,data,function(response,status,xhr))
| パラメータ | 説明 |
|---|---|
| url | リクエストを送信するURLを指定します。 |
| data | オプション。リクエストとともにサーバーに送信されるデータを指定します。 |
| function(response,status,xhr) |
オプション。リクエストが完了したときに実行される関数を指定します。 追加のパラメータ：
|
詳細説明
これはサーバーからデータを取得する最もシンプルな方法です。これは$.get(url, data, success)とほぼ等価ですが、これはグローバル関数ではなく、暗黙の回调関数を持っています。成功した応答を検出した場合（例えば、textStatusが"success"または"notmodified"の場合）、.load()は要素のHTML内容を返されたデータに設定します。これは、该方法の多くの使用が非常にシンプルになることを意味します：
$("#result").load("ajax/test.html");
コールバック関数が提供されている場合、ポストプロセッシングの後に行われます：
$("#result").load("ajax/test.html", function() {
alert("Load was performed.");
});
上記の2つの例では、現在のドキュメントに"result"IDが含まれていない場合、.load()メソッドは実行されません。
データがオブジェクトの場合はPOSTメソッドを使用し、それ以外の場合はGETメソッドを使用します。
ページの一部をロードする
.load()メソッドは、$.get()とは異なり、インサートするリモートドキュメントの一部を指定することができます。これはURLパラメータの特別な構文によって実現されています。この文字列にスペースが含まれており、最初のスペースに続く文字列は、読み込む内容を決定するjQuery選択器です。
上記の例を変更することで、取得したドキュメントの一部を使用することができます：
$("#result").load("ajax/test.html #container");
このメソッドを実行すると、ajax/test.htmlの内容を取得しますが、その後jQueryは返されたドキュメントを解析し、コンテナIDを持つ要素を探します。この要素とその内容は、結果IDを持つ要素に挿入され、取得されたドキュメントの残りの部分は捨てられます。
jQuery はブラウザの .innerHTML プロパティを使用して取得されたドキュメントを解析し、それを現在のドキュメントに挿入します。このプロセス中に、ブラウザはドキュメントから要素（例えば <html>, <title>、または <head> 要素）をフィルタリングすることがあります。その結果、.load() で取得された要素はブラウザが直接取得したドキュメントと完全に同じではありません。
注釈：ブラウザのセキュリティ制限により、多くの "Ajax" リクエストがソースポリシーに従います；異なるドメイン、サブドメイン、またはプロトコルからのデータの取得は成功しません。
さらに多くの例
例 1
feeds.html ファイルの内容をロードする：
$("#feeds").load("feeds.html");
例 2
上記の例と同様ですが、POST 形式で追加のパラメータを送信し、成功時にメッセージを表示する：
$("#feeds").load("feeds.php", {limit: 25}, function(){
alert("フィードの最後の 25 件のエントリがロードされました");
});
例 3
無序列表に記事のサイドバーナビゲーション部分をロードする：
HTML コード：
<b>jQuery リンク:</b> <ul id="links"></ul>
jQuery コード：
$("#links").load("/Main_Page #p-Getting-Started li");
さらに多くの TIY インスタンス
- AJAX リクエストの生成、およびそのリクエストを通じてデータを送信する
- AJAX リクエストを通じてデータを送信するために data パラメータを使用する方法。（AJAX 教程で説明されています。）
- AJAX リクエストの生成、およびコールバック関数を使用する
- AJAX リクエストからデータ結果を取得するために function パラメータを使用する方法
- エラーを持つ AJAX リクエストの生成
- AJAX リクエスト中のエラーを処理するために function パラメータを使用する方法（XMLHttpRequest パラメータを使用）
