最近比較空閑,于是抽個(gè)時(shí)間整理些關(guān)于ajax方法的東東。在項(xiàng)目中經(jīng)常發(fā)現(xiàn)ajax板塊好多問(wèn)題都是屬性,方法,事件大小寫(xiě)不區(qū)分問(wèn)題,最終導(dǎo)致了程序運(yùn)行出現(xiàn)麻煩。
下面是ajax對(duì)象的一些常用屬性,事件和方法
1)標(biāo)準(zhǔn)的ajax對(duì)象的屬性有readyState,status,responseText,responseXML
2)非標(biāo)準(zhǔn)ajax對(duì)象屬性,針對(duì)IE瀏覽器的,有responseBody,2進(jìn)制數(shù)據(jù)流。如果不考慮瀏覽器兼容,這個(gè)屬性+VBScript能很好的解決亂碼問(wèn)題?!?br />
Visual Basic code
Function Bytes2BStr(vin)'二進(jìn)制轉(zhuǎn)字串
strreturn = ""
for i = 1 to lenb(vin)
thischarcode = ascb(midb(vin,i,1))
if thischarcode h80 then
strreturn = strreturn chr(thischarcode)
else
nextcharcode = ascb(midb(vin,i+1,1))
strreturn = strreturn chr(clng(thischarcode) * h100 + cint(nextcharcode))
i = i + 1
end if
next
Bytes2BStr = strreturn
End Function
3)事件onreadystatechange,狀態(tài)轉(zhuǎn)換函數(shù)
4)方法有setRequestHeader,open,send,用于設(shè)置響應(yīng)頭的,當(dāng)指定提交方法為POST的時(shí)候,需要設(shè)置content-type為application/x-www-form-urlencoded,如果未設(shè)置這個(gè)響應(yīng)頭,請(qǐng)求的動(dòng)態(tài)頁(yè)無(wú)法使用鍵值對(duì)的形式獲取到值,不過(guò)可以從二進(jìn)制流中生成提交的數(shù)據(jù)。
參考
ajax指定為post但是未設(shè)置content-type或未指定鍵時(shí)時(shí)如何獲取提交的內(nèi)容
容易出現(xiàn)錯(cuò)誤的問(wèn)題
1)對(duì)于使用XMLHttpRequest創(chuàng)建的對(duì)象,包括IE7+,屬性是嚴(yán)格區(qū)分大小寫(xiě)的,一定要注意大小寫(xiě)的問(wèn)題,要不不區(qū)分大小,屬性值就是 undefined。如readyState寫(xiě)成readystate,responseText寫(xiě)成responsetext。
2)對(duì)于IE瀏覽器,如果是先判斷activexobject,那么會(huì)執(zhí)行activexobject創(chuàng)建xhr對(duì)象,使用acx創(chuàng)建的xhr對(duì)象,屬性,事件,方法都不區(qū)分大小寫(xiě)
3)使用XMLHttpRequest創(chuàng)建時(shí),onreadystatechange一定全部為小寫(xiě),要不相當(dāng)于給xhr對(duì)象賦值一個(gè)自定義屬性,而不是實(shí)際的狀態(tài)轉(zhuǎn)換函數(shù)。這樣永遠(yuǎn)都不執(zhí)行回調(diào)。對(duì)于IE使用activexobject創(chuàng)建的xhr對(duì)象,不區(qū)分大小寫(xiě)
4)同2,3點(diǎn),XMLHttpRequest創(chuàng)建時(shí),調(diào)用方法一定要區(qū)分大小寫(xiě),要不會(huì)出錯(cuò),提示找不到方法。IE使用activexobject創(chuàng)建不會(huì)區(qū)分大小寫(xiě)。
特別強(qiáng)調(diào)的是,一定要調(diào)用open方法后,才能執(zhí)行setRequestHeader方法,要不會(huì)出錯(cuò)。
對(duì)于手寫(xiě)ajax代碼一些建議
1)為get提交時(shí),不需要設(shè)置content-type了,除非請(qǐng)求的是一些需要檢查content-type生成一些對(duì)應(yīng)的數(shù)據(jù)格式的文件。如 asp.net的webservice會(huì)檢查content-type,如果指定content-type為application/json,會(huì)生成對(duì)應(yīng)的json格式的字符串。
2)為get提交時(shí),如果沒(méi)有數(shù)據(jù),調(diào)用send方法時(shí)最好添加一個(gè)null作為參數(shù)。xhr.send(null);
3)為post提交時(shí),一定不要忘記在調(diào)用open方法后,再調(diào)用setRequestHeader方法設(shè)置content-type為application/x-www-form-urlencoded
4) 在使用responseText,responseXML和responseBody【IE only】,status屬性時(shí),需要在readyState==4,status狀態(tài)==200【在線測(cè)試】或者status狀態(tài)==0【本地測(cè)試】時(shí)再使用
JavaScript code
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("microsft.xmlhttp");
xhr.open('get', 'index.html', true);
xhr.onreadystatechange = function () {
if (4 == xhr.readyState) {
if (200 == xhr.status || 0 == xhr.status) {
//=========正常返回后的處理代碼
}
else alert('動(dòng)態(tài)頁(yè)出問(wèn)題了~~');
}
}
xhr.send(null);
5)如果為異步執(zhí)行時(shí),需要添加狀態(tài)轉(zhuǎn)換函數(shù),然后在readyState位4時(shí)使用responseText或者responseXML屬性。
如果為同步執(zhí)行時(shí),可以在send完后,直接使用responseText或者responseXML屬性,不需要添加onreadystatechange狀態(tài)轉(zhuǎn)換函數(shù)了。不過(guò)為同步時(shí)如果網(wǎng)速慢容易造成瀏覽器假死,用戶(hù)體驗(yàn)不好。
6)最簡(jiǎn)單的~~hoho~~改用jquery框架吧。
您可能感興趣的文章:- ajax中文亂碼的各種解決辦法總結(jié)
- ajax問(wèn)題總結(jié) 比較全
- Ajax與JSON的一些學(xué)習(xí)總結(jié)
- ajax請(qǐng)求get與post的區(qū)別總結(jié)
- ajax 入門(mén)基礎(chǔ)之 XMLHttpRequest對(duì)象總結(jié)
- ajax原理總結(jié)附簡(jiǎn)單實(shí)例及其優(yōu)點(diǎn)
- 總結(jié)AJAX相關(guān)JS代碼片段和瀏覽器模型
- 關(guān)于Ajax技術(shù)原理的3點(diǎn)總結(jié)
- 使用ajax異步提交表單的幾種方法總結(jié)
- 初學(xué)者必看的Ajax總結(jié)篇