JQueryによるAjaxの実装
1459 ワード
オリジナルJavaScriptによるAjaxの実現は複雑であり,サーバが複雑な構造のデータを返すと処理が煩雑になるほか,ブラウザ互換性の問題も考慮し,JQueryはAjaxに関する操作をカプセル化し,jQueryを用いてAjaxをより簡潔で便利に実現した.
$.ajax()メソッド:
$.ajax()は、HTTPリクエストを送信してリモートデータをロードすることができ、jQueryの最下層のAjaxで実現され、柔軟性が高い
構文:$.ajax([settings]); パラメータsettingは$である.ajax()メソッドのパラメータのリストです.Ajaxリクエストのキー値ペアのセットを構成するために使用されます.一般的なパラメータ:
url String送信要求のアドレス、デフォルトは現在のページアドレス
type Stringリクエスト方式(postまたはget、デフォルトはget)
Data PlainObjectまたはStringまたはArrayがサーバに送信するデータ
DataType Stringは、XML、HTML、JSON、Textのようなサーバから返されるデータ型を期待します.
beforeSend Function(jqXHR jqxhr,String status)は、リクエストを送信する前に呼び出される関数で、リクエストヘッダを設定し、FALSE終了リクエストを返すことができます.
success Function(任意のタイプresult、要求が成功した後に呼び出される関数、
String textStatus,jqXHR jqxhr)パラメータresult:オプションでサーバから返されるデータ
パラメータtextStatus:オプション、エラー情報
$.ajax()メソッドのパラメータ構文は比較的特殊で、パラメータリストはカッコ「{}」の間に含まれる必要があります.パラメータ名:「パラメータ値」で書くパラメータはありません.複数のパラメータがある場合は、カンマ","で区切ります.----JSON表記
例:
$.ajax()メソッド:
$.ajax()は、HTTPリクエストを送信してリモートデータをロードすることができ、jQueryの最下層のAjaxで実現され、柔軟性が高い
構文:$.ajax([settings]); パラメータsettingは$である.ajax()メソッドのパラメータのリストです.Ajaxリクエストのキー値ペアのセットを構成するために使用されます.一般的なパラメータ:
url String送信要求のアドレス、デフォルトは現在のページアドレス
type Stringリクエスト方式(postまたはget、デフォルトはget)
Data PlainObjectまたはStringまたはArrayがサーバに送信するデータ
DataType Stringは、XML、HTML、JSON、Textのようなサーバから返されるデータ型を期待します.
beforeSend Function(jqXHR jqxhr,String status)は、リクエストを送信する前に呼び出される関数で、リクエストヘッダを設定し、FALSE終了リクエストを返すことができます.
success Function(任意のタイプresult、要求が成功した後に呼び出される関数、
String textStatus,jqXHR jqxhr)パラメータresult:オプションでサーバから返されるデータ
パラメータtextStatus:オプション、エラー情報
$.ajax()メソッドのパラメータ構文は比較的特殊で、パラメータリストはカッコ「{}」の間に含まれる必要があります.パラメータ名:「パラメータ値」で書くパラメータはありません.複数のパラメータがある場合は、カンマ","で区切ります.----JSON表記
例:
$.ajax({
"url":"userServlet", // URL
"type":"GET", //
"data":"name="+name, //
"dataType":"text", //
"success":"callback", //
"error":function(){ //
alert(" , ");
}
});
//
function callback(data){
if(data=="true"){
$("#nameDIV").html(" ");
}else{
$("#nameDIV").html(" ");
}
}