jQuery 基礎チュートリアル

jQuery エフェクト

jQuery 操作方法

jQuery 過剰

jQuery Ajax

jQuery 極端

jQuery 参考手帳

jQuery 極端メソッド jQuery AJAX メソッド

jQuery load() メソッド

jQuery Ajaxメソッド

load()メソッドは、サーバーからデータをロードし、返されたHTMLを選択された要素に挿入します。

load()メソッドは、サーバーからデータを取得する最も簡単な方法です。$ .get(url,data,callback)に似ていますが、グローバル関数ではなくメソッドであり、暗黙のcallback関数を持っています。

リクエストメソッド：以下をdataオブジェクトとして提供された場合、POSTメソッドを使用します。それ以外の場合、GETと仮定します。

文法：

$(selector).load(URL,　data,　callback)

例

ajax_intro.txtファイルの内容をDIV要素にロードします：

例

$("button").click(function(){
　　$("div").load("ajax_intro.txt");
});

テストして‹/›

get()メソッドとは異なり、load()メソッドはリモートドキュメントの一部を挿入できるように許可します：

例

$("button").click(function(){
　　$("div").load("/jQuery/ajax_load.html　#table");
});

テストして‹/›

ajax_post.phpページをロードし、他のデータを送信します：

例

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("div").load("ajax_post.php",　data);
});

テストして‹/›

ajax_post.phpページをロードし、他のデータを送信し、ステータスメッセージを警告します：

例

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("div").load("ajax_post.php",　data,　function(response,　status){
　　　　alert(status);
　　});
});

テストして‹/›

もしAjaxリクエストにエラーが発生した場合、通知を表示します：

例

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("#success").load("wrong_file.php",　data,　function(response,　status,　xhr){
　　　　if(status　==　"error"){
　　　　　　let　msg　=　"申し訳ありません、エラーが発生しました:　";
　　　　　　$("#error").html(msg　+　xhr.status　+　"　"　+　xhr.statusText);
　　　　}
　　});
});

テストして‹/›

パラメータ値

パラメータ	説明
URL	リクエストしたいURLを指定
data	（オプション）リクエストと一緒にサーバーに送信される純粋なオブジェクトまたは文字列を指定
callback	（オプション）リクエストが完了したときに実行されるコールバック関数を指定パラメータ： response　 -リクエスト中の結果データを含む status -リクエストの状態（"成功", "未変更", "エラー", "タイムアウト", または "parsererror"）を含む xhr-XMLHttpRequestオブジェクトを含む

jQuery Ajaxメソッド

jQuery 極端メソッド jQuery AJAX メソッド