下面給大家分享一篇Ajax.Request類附代碼詳細解析,感興趣的朋友跟小編一起來了解一下吧!希望對大家有所幫助哦!
目的:因為blog程序里的某些模塊需要用到ajax,直接使用prototype.js體積比較大(40多k),而且僅僅用到其中的ajax功能,因此為了減輕下載的負擔,又不能改動已經在prototype.js框架下寫好的代碼,只能是按照prototype的風格,自己寫一個ajax類,達到零成本移植框架。
新的ajax類如下:
varAjax={xmlhttp:function(){
try{
returnnewActiveXObject('Msxml2.XMLHTTP');
}catch(e){
try{
returnnewActiveXObject('Microsoft.XMLHTTP');
}catch(e){
returnnewXMLHttpRequest();
}
}
}
};
Ajax.Request=function(){
if(arguments.length
var_p={asynchronous:true,method:"GET",parameters:""};//defaultoption
for(varkeyinarguments[1]){//customoptionoverwritedefaultoption
_p[key]=arguments[1][key];
}
var_x=Ajax.xmlhttp();//xmlobj
var_url=arguments[0];//str
if(_p["parameters"].length>0)_p["parameters"]+='&_=';
if(_p["method"].toUpperCase()=="GET")_url+=(_url.match(//?/)?'&':'?')+_p["parameters"];
_x.open(_p["method"],_url,_p["asynchronous"]);
_x.onreadystatechange=function(){
if(_x.readyState==4){
if(_x.status==200){
_p["onComplete"]?_p["onComplete"](_x):"";
}else{
_p["onError"]?_p["onError"](_x):"";
}
}
}
if(_p["method"].toUpperCase()=="POST")_x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
_x.send(_p["method"].toUpperCase()=="POST"?_p["parameters"]:null);
};
這個類保存成js文件,體積還不到1k,足夠小了。哈哈。
調用方法:
varmyAjax=newAjax.Request(
"http://localhost/abc.asp",
{
method:"post",
parameters:"demo=123456789abc",
onComplete:function(xmlhttp){
alert(xmlhttp.responseText)
}
}
);
調用的風格完全與原來相同!
目前這個新類只有兩個回調函數:onComplete與onError,Ajax類也只有Request一個方法,畢竟現在blog程序還不需要這么多應用嘛。parameters屬性有個默認值:{asynchronous:true,method:"GET",parameters:""},可以從中知道,如果調用時不傳入asynchronous、method、parameters三個參數,那么類將使用默認值。
以上就是Ajax.Request類附代碼詳細解析,想必都了解了吧,更多相關內容請繼續關注錯新技術頻道。
新聞熱點
疑難解答
圖片精選