快捷導(dǎo)航

jquery中ajax學(xué)習(xí)筆記3

更新時(shí)間：2011年10月16日 23:19:45 作者：

由于很多知識(shí)都已經(jīng)做了詳細(xì)介紹，本節(jié)只介紹需要修改的代碼，使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數(shù)據(jù)，web.xml、后臺(tái)的servet都不用改

摘要：
ajax學(xué)習(xí)1中介紹了使用jquery封裝的ajax來(lái)接收服務(wù)器端的文本數(shù)據(jù)以及使用XMLHttpReques對(duì)象來(lái)接收服務(wù)器端的文本數(shù)據(jù)
ajax學(xué)習(xí)2中介紹了使用XMLHttpReques來(lái)接收服務(wù)器的端XML數(shù)據(jù)，本節(jié)主要介紹使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數(shù)據(jù)。

由于很多知識(shí)都已經(jīng)做了詳細(xì)介紹，本節(jié)只介紹需要修改的代碼，使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數(shù)據(jù)，web.xml、后臺(tái)的servet都不用改，
只是ajax.html中調(diào)用的方法名稱(chēng)修改一下，改為新增加的javascript方法。

用到的主要的一個(gè)方法介紹：
jQuery.ajax(options)：通過(guò)HTTP請(qǐng)求加載遠(yuǎn)程數(shù)據(jù)，
返回值：XMLHttpRequest
參數(shù)：options(可選)，ajax請(qǐng)求設(shè)置。所有選項(xiàng)都是可選的。
主要選項(xiàng)介紹：
type (String) : (默認(rèn): "GET") 請(qǐng)求方式 ("POST" 或 "GET")，默認(rèn)為 "GET"。注意：其它 HTTP 請(qǐng)求方法，如 PUT 和 DELETE 也可以使用，但僅部分瀏覽器支持
url (String) : (默認(rèn): 當(dāng)前頁(yè)地址) 發(fā)送請(qǐng)求的地址
data (Object,String) : 發(fā)送到服務(wù)器的數(shù)據(jù)。將自動(dòng)轉(zhuǎn)換為請(qǐng)求字符串格式。GET 請(qǐng)求中將附加在 URL 后
dataType (String) : 預(yù)期服務(wù)器返回的數(shù)據(jù)類(lèi)型。
如果不指定，jQuery 將自動(dòng)根據(jù) HTTP 包 MIME 信息返回 responseXML 或 responseText，并作為回調(diào)函數(shù)參數(shù)傳遞，可用值:
"xml": 返回 XML 文檔，可用 jQuery 處理。
"html": 返回純文本 HTML 信息；包含 script 元素。
"script": 返回純文本 JavaScript 代碼。不會(huì)自動(dòng)緩存結(jié)果。
"json": 返回 JSON 數(shù)據(jù)
success (Function) : 請(qǐng)求成功后回調(diào)函數(shù)。參數(shù)：服務(wù)器返回?cái)?shù)據(jù)，數(shù)據(jù)格式
error (Function) : (默認(rèn): 自動(dòng)判斷 (xml 或 html)) 請(qǐng)求失敗時(shí)調(diào)用時(shí)間
async (Boolean) : (默認(rèn): true) 默認(rèn)設(shè)置下，所有請(qǐng)求均為異步請(qǐng)求。
如果需要發(fā)送同步請(qǐng)求，請(qǐng)將此選項(xiàng)設(shè)置為 false。注意，同步請(qǐng)求將鎖住瀏覽器，用戶(hù)其它操作必須等待請(qǐng)求完成才可以執(zhí)行

新增的javascript方法如下：

復(fù)制代碼代碼如下:

 
<!--用戶(hù)名稱(chēng)的校驗(yàn)，采用jquery封裝的ajax，接收XML格式的響應(yīng)數(shù)據(jù)--> 
//通過(guò)$.ajax()方法 通過(guò)HTTP請(qǐng)求加載遠(yuǎn)程數(shù)據(jù) 
function verifyJqueryXML(){ 
var jqueryObj= $("#username"); 
var username= jqueryObj.val(); 
//javascript當(dāng)中，一個(gè)簡(jiǎn)單的對(duì)象的定義方法 
//var obj={name:"abc",age:20}; 
//使用jquery的XMLHTTPRequest對(duì)象的get請(qǐng)求的封裝 
$.ajax({ 
type:"POST",//請(qǐng)求方式 
url:"AJAXXMLServer", //服務(wù)器端的url地址 
data:"name="+username, // 發(fā)送給服務(wù)器端的數(shù)據(jù) 
dataType:"xml", //告訴Jquery返回的數(shù)據(jù)格式 
success:callback1 //定以交互完成，并且服務(wù)器端正確返回?cái)?shù)據(jù)時(shí)調(diào)用的回調(diào)函數(shù) 
}); //注意url和 dataType必須對(duì)應(yīng) 
} 
function callback1(data){ 
//首先需要將dom的對(duì)象轉(zhuǎn)換成Jquery對(duì)象 
var jqueryObj=$(data); 
//獲取message節(jié)點(diǎn) 
var message=jqueryObj.children(); 
//獲取文本內(nèi)容 
var text=message.text(); 
//將服務(wù)器端的值動(dòng)態(tài)的顯示在頁(yè)面上 
var resultObj=$("#result"); 
resultObj.html(text); 
} 