jquery_jquery での get、post、および ajax メソッドの使用の概要

JQuery では、get、post、および ajax メソッドを使用してサーバーにデータを転送できます

get メソッドの使用法 (customForGet.js ファイル):

function verify(){
//1. テキストボックスのデータを取得します

//DOM を通じて取得します
//document.getElementByIdx("userName");
//JQuery を通じて取得します
var jqueryObj = $("#userName");
/ /ノードの値を取得します
var userName = jqueryObj.val();

//2. テキスト ボックスのデータをサーバー側のサーブレットに送信します
$.get("AJAXServer?name=" userName,null,callback);
}
//コールバック関数
関数コールバック(データ){

///3. サーバーから返されたデータを受け入れます
//alert(data);
//4. サーバーから返されたデータをページに表示します
//結果情報を表示するノード
var resultObj = $("#result");
resultObj.html(data);
}

上記のファイルは次のように省略できます:
function verify(){
$.get("AJAXServer?name=" $("#userName").val(),null,function callback(data ){$("#result").html(データ);});
}

投稿メソッド (customForPost.js) の使用法:

function verify(){
//1. テキストボックスのデータを取得します

//DOM を通じて取得します
//document.getElementByIdx("userName");
//JQuery を通じて取得します
var jqueryObj = $("#userName");
/ /ノードの値を取得します
var userName = jqueryObj.val();

//2. テキスト ボックスのデータをサーバー側のサーブレットに送信します
// $.post("AJAXServer?name=" userName,null,callback);//パラメータを直接続けることもできますpost URL の後に
$.post("AJAXServer",{name:userName,test:"test123"},callback);//複数のパラメータを渡す場合は、属性値が変数の場合はカンマで区切ります。 userName のように直接記述します。文字の場合は、"test123".
}
//Callback function
function callback(data){

のように記述します。

///3. サーバーから返されたデータを受け入れます
//alert(data);
//4. サーバーから返されたデータをページに表示します
//結果情報を表示するノード
var resultObj = $("#result");
resultObj.html(data);
}

上記のファイルは次のように省略できます:
function verify(){
$.post("AJAXServer",{name:$("#userName").val(),test: "test123"},function(data){$("#result").html(data)});
}

概要: 実際、get メソッドと post メソッドは、get メソッドと post メソッドが交換されている限り似ており、パラメータの保存場所は両方の場所で使用できます。 >

例:

$.post("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data) });

パラメータの位置を変更せずに、post を直接 get に変更するだけです。

$.get("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data) });

ajax メソッド (customForAjaxText) を使用すると、データ型がプレーン テキストのデータを受け取ります:

function verify(){

//1. テキストボックスのデータを取得します
//JQuery を通じて取得します
var jqueryObj = $("#userName");
//取得 ノードの値
var userName = jqueryObj.val();

//2. テキスト ボックスのデータをサーバー側のサーブレットに送信します

$.ajax({
type:"POST",
url:"AJAXServer",
data:") name =" userName "&" "test=123",
success:function(data){
$("#result").html(data);
}
});
}

データ型が XML であるデータを受信するための ajax メソッド (customForAjaxText) の使用:

function verify(){

//1. テキストボックスのデータを取得します
//JQuery を通じて取得します
var jqueryObj = $("#userName");
//取得 ノードの値
var userName = jqueryObj.val();

//2. テキスト ボックス データをサーバー側のサーブレットに送信します

$.ajax({
type:"POST",
url:"AJAXXMLServer",
data:") name =" ユーザー名 "&" "test=123",

dataType: "xml",

success:function(data){
//まず、渡された DOM オブジェクトを jquery オブジェクトに変換する必要があります
var jqueryObj = $(data);
//メッセージノードを取得します
var messageNods = jqueryObj.children();
//テキストコンテンツを取得します
var responseText = messageNods.text();
$("#result") .html(responseText);
}
});
}