- 相關(guān)推薦
jquery中ajax學(xué)習筆記
摘要:
ajax學(xué)習1中介紹了使用jquery封裝的ajax來(lái)接收服務(wù)器端的文本數據以及使用XMLHttpReques對象來(lái)接收服務(wù)器端的文本數據
ajax學(xué)習2中介紹了使用XMLHttpReques來(lái)接收服務(wù)器的端XML數據,本節主要介紹使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數據。
由于很多知識都已經(jīng)做了詳細介紹,本節只介紹需要修改的代碼,使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數據,web.xml、后臺的servet都不用改,
只是ajax.html中調用的方法名稱(chēng)修改一下,改為新增加的javascript方法。
用到的主要的一個(gè)方法介紹:
jQuery.ajax(options):通過(guò)HTTP請求加載遠程數據,
返回值:XMLHttpRequest
參數:options(可選),ajax請求設置。所有選項都是可選的。
主要選項介紹:
type (String) : (默認: "GET") 請求方式 ("POST" 或 "GET"), 默認為 "GET"。注意:其它 HTTP 請求方法,如 PUT 和 DELETE 也可以使用,但僅部分瀏覽器支持
url (String) : (默認: 當前頁(yè)地址) 發(fā)送請求的地址
data (Object,String) : 發(fā)送到服務(wù)器的數據。將自動(dòng)轉換為請求字符串格式。GET 請求中將附加在 URL 后
dataType (String) : 預期服務(wù)器返回的數據類(lèi)型。
如果不指定,jQuery 將自動(dòng)根據 HTTP 包 MIME 信息返回 responseXML 或 responseText,并作為回調函數參數傳遞,可用值:
"xml": 返回 XML 文檔,可用 jQuery 處理。
"html": 返回純文本 HTML 信息;包含 script 元素。
"script": 返回純文本 JavaScript 代碼。不會(huì )自動(dòng)緩存結果。
"json": 返回 JSON 數據
success (Function) : 請求成功后回調函數。參數:服務(wù)器返回數據,數據格式
error (Function) : (默認: 自動(dòng)判斷 (xml 或 html)) 請求失敗時(shí)調用時(shí)間
async (Boolean) : (默認: true) 默認設置下,所有請求均為異步請求。
如果需要發(fā)送同步請求,請將此選項設置為 false。注意,同步請求將鎖住瀏覽器,用戶(hù)其它操作必須等待請求完成才可以執行
新增的javascript方法如下:
復制代碼 代碼如下:
//通過(guò)$.ajax()方法 通過(guò)HTTP請求加載遠程數據
function verifyJqueryXML(){
var jqueryObj= $("#username");
var username= jqueryObj.val();
//javascript當中,一個(gè)簡(jiǎn)單的對象的定義方法
//var obj={name:"abc",age:20};
//使用jquery的XMLHTTPRequest對象的get請求的封裝
$.ajax({
type:"POST",//請求方式
url:"AJAXXMLServer", //服務(wù)器端的url地址
data:"name="+username, // 發(fā)送給服務(wù)器端的數據
dataType:"xml", //告訴Jquery返回的數據格式
success:callback1 //定以交互完成,并且服務(wù)器端正確返回數據時(shí)調用的回調函數
}); //注意url和 dataType必須對應
}
function callback1(data){
//首先需要將dom的對象轉換成Jquery對象
var jqueryObj=$(data);
//獲取message節點(diǎn)
var message=jqueryObj.children();
//獲取文本內容
var text=message.text();
//將服務(wù)器端的值動(dòng)態(tài)的顯示在頁(yè)面上
var resultObj=$("#result");
resultObj.html(text);
}
通過(guò)以上代得到,ajax.html中的調用javascript方法名稱(chēng)應改為:verifyJqueryXML()
【jquery中ajax學(xué)習筆記】相關(guān)文章:
jQuery的DOM操作筆記07-29
jQuery中prev()方法用法07-16
jQuery中parent()和siblings()的問(wèn)題10-16
零基礎學(xué)習AJAX之制作自動(dòng)校驗的表單問(wèn)題07-25
jQuery程序設計08-05
jquery提交按鈕的代碼07-28