ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery プロセスは XML 形式でデータを返します (分析例)_jquery

jQuery プロセスは XML 形式でデータを返します (分析例)_jquery

WBOY
WBOYオリジナル
2016-05-16 17:11:591101ブラウズ

このサンプル プログラムでは、$.ajax() メソッドを使用します。$.get() メソッドを使用することもできますが、コードが複雑すぎず、理解しやすいと思います。

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

//ユーザー名の検証方法を定義します
function verify(){
//最初にページ上のボタンの押下をテストします。このメソッドを呼び出すことができます
//JavaScript のalert メソッドを使用して、ポップアップ プロンプト ボックスを表示します
/ /alert("ボタンがクリックされました! ! ");
//1. テキスト ボックスの内容を取得します
//document.getElementById("userName"); //Jquery のノードの検索方法ノードは、パラメータの id 属性値に # を追加することで見つけることができます。
//jquery メソッドは jquery オブジェクトを返し、それらに対して他の jquery メソッドを引き続き実行できます
var jqueryObj = $("#userName");
// ノードの値を取得します
var userName = jqueryObj.val();
//alert(userName);
//2. テキスト ボックス内のデータをサーバー セグメントのサーベルトに送信します
//JavaScript では、単純なオブジェクト定義メソッド
var obj = {name: "123",age:20};
//jquery の XMLHTTPrequest オブジェクトを使用 get リクエストのカプセル化
$.ajax({
type: " POST", //http リクエスト メソッド
url: "AJAXXMLServer", //サーバー セグメント URL アドレス
data: "name=" userName, //サーバー セグメントに送信されるデータ
dataType: "xml" , //返すデータ形式を JQuery に指示します
Success: callback //インタラクションが完了し、サーバーがデータを正しく返すときに呼び出されるコールバック関数を定義します
});
}

コールバック関数:

コードをコピー コードは次のとおりです:
//コールバック関数
function callback (data) {
//alert("サーバー セグメントからのデータが戻ってきました!!");
//3. サーバーから返されたデータを受信します
//データdom オブジェクトのデータは解析する必要があります
//まず dom オブジェクトを JQuery オブジェクトに変換する必要があります
var jqueryObj = $(data);
//メッセージ ノードを取得します
var message = jqueryObj.children();
//テキスト コンテンツを取得します
var text = message.text();
//4. サーバー セグメントから返されたデータをページに動的に表示します
//結果情報を保存するノードを検索します
var resultObj = $("#result");
// ページ上の div ノードのコンテンツを動的に変更します
resultObj.html(text );
アラート("");
}

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。