Ajax and Jquery 學(xué)習(xí)筆記(精簡版-2)
1.獲取文本框中的內(nèi)容:
a.document.getElementById("userName");//dom方式
b.Jquesry 的查找節(jié)點方式,參數(shù)中#加上id屬性值可以找到一個節(jié)點,jquery的方法返回的都是jquery的對象,可以繼續(xù)在上面執(zhí)行其他的jquery方法
例如:
獲取節(jié)點 var jqueryObj = $("#userName");
獲取節(jié)點值 var userName = jqueryObj.val();
2.將文本框中的數(shù)據(jù)發(fā)送給服務(wù)器端的servelet(javascript當(dāng)中,一個簡單的對象的定義方法)
例如:
var obj = {name:"123",age:20}; //使用jquery的XMLHTTPrequest對象get請求的封裝
$.ajax({
type: "POST", //http請求方式
url: "AJAXXMLServer", //服務(wù)器段url地址
data: "name=" + userName, //發(fā)送給服務(wù)器段的數(shù)據(jù)
dataType: "xml", //告訴JQuery返回的數(shù)據(jù)格式
success: callback //定義交互完成,并且服務(wù)器正確返回數(shù)據(jù)時調(diào)用的回調(diào)函數(shù)
});
3.然后定義回調(diào)方法:
function callback(data) {
//3.接收服務(wù)器端返回的數(shù)據(jù)
//需要將data這個dom對象中的數(shù)據(jù)解析出來
//首先需要將dom的對象轉(zhuǎn)換成JQuery的對象
var jqueryObj = $(data);
//獲取message節(jié)點
var message = jqueryObj.children();
//獲取文本內(nèi)容
var text = message.text();
//4.將服務(wù)器段返回的數(shù)據(jù)動態(tài)的顯示在頁面上
//找到保存結(jié)果信息的節(jié)點
var resultObj = $("#result");
//動態(tài)的改變頁面中div節(jié)點中的內(nèi)容
resultObj.html(text);
alert("");
}
4.心得:
解決中文亂麻問題的方法:
(1)頁面端發(fā)出的數(shù)據(jù)作一次encodeURI,服務(wù)器段使用
new String(old.getBytes("iso8859-1"),"UTF-8");
(2)頁面端發(fā)出的數(shù)據(jù)作兩次encodeURI,服務(wù)器段使用URLDecoder.decode(old,"UTF-8")
例如: var url = "AJAXServer?name=" + encodeURI(encodeURI($("#userName").val()));
a.document.getElementById("userName");//dom方式
b.Jquesry 的查找節(jié)點方式,參數(shù)中#加上id屬性值可以找到一個節(jié)點,jquery的方法返回的都是jquery的對象,可以繼續(xù)在上面執(zhí)行其他的jquery方法
例如:
獲取節(jié)點 var jqueryObj = $("#userName");
獲取節(jié)點值 var userName = jqueryObj.val();
2.將文本框中的數(shù)據(jù)發(fā)送給服務(wù)器端的servelet(javascript當(dāng)中,一個簡單的對象的定義方法)
例如:
var obj = {name:"123",age:20}; //使用jquery的XMLHTTPrequest對象get請求的封裝
$.ajax({
type: "POST", //http請求方式
url: "AJAXXMLServer", //服務(wù)器段url地址
data: "name=" + userName, //發(fā)送給服務(wù)器段的數(shù)據(jù)
dataType: "xml", //告訴JQuery返回的數(shù)據(jù)格式
success: callback //定義交互完成,并且服務(wù)器正確返回數(shù)據(jù)時調(diào)用的回調(diào)函數(shù)
});
3.然后定義回調(diào)方法:
function callback(data) {
//3.接收服務(wù)器端返回的數(shù)據(jù)
//需要將data這個dom對象中的數(shù)據(jù)解析出來
//首先需要將dom的對象轉(zhuǎn)換成JQuery的對象
var jqueryObj = $(data);
//獲取message節(jié)點
var message = jqueryObj.children();
//獲取文本內(nèi)容
var text = message.text();
//4.將服務(wù)器段返回的數(shù)據(jù)動態(tài)的顯示在頁面上
//找到保存結(jié)果信息的節(jié)點
var resultObj = $("#result");
//動態(tài)的改變頁面中div節(jié)點中的內(nèi)容
resultObj.html(text);
alert("");
}
4.心得:
解決中文亂麻問題的方法:
(1)頁面端發(fā)出的數(shù)據(jù)作一次encodeURI,服務(wù)器段使用
new String(old.getBytes("iso8859-1"),"UTF-8");
(2)頁面端發(fā)出的數(shù)據(jù)作兩次encodeURI,服務(wù)器段使用URLDecoder.decode(old,"UTF-8")
例如: var url = "AJAXServer?name=" + encodeURI(encodeURI($("#userName").val()));
posted on 2009-11-05 17:11 mingruofei 閱讀(203) 評論(0) 編輯 收藏