如何寫一個Ajax.Request類

小編給大家分享一下如何寫一個Ajax.Request類，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

目的：因為blog程序里的某些模塊需要用到ajax，直接使用prototype.js體積比較大(40多k)，而且僅僅用到其中的ajax功能，因此為了減輕下載的負擔，又不能改動已經(jīng)在prototype.js框架下寫好的代碼，只能是按照prototype的風格，自己寫一個ajax類，達到零成本移植框架。

新的ajax類如下：

var Ajax = {xmlhttp:function(){
try{
return new ActiveXObject('Msxml2.XMLHTTP');
}catch(e){
try{
return new ActiveXObject('Microsoft.XMLHTTP');
}catch(e){
return new XMLHttpRequest();
}
} 
}
};

Ajax.Request = function(){
if (arguments.length<2) return;
var _p = {asynchronous:true,method:"GET",parameters:""}; //default option
for (var key in arguments[1]){ // custom option overwrite default option
_p[key] = arguments[1][key]; 
}
var _x = Ajax.xmlhttp(); //xml obj
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，足夠小了。哈哈。
調(diào)用方法：

var myAjax = new Ajax.Request(
"http://localhost/abc.asp",
{
method:"post",
parameters:"demo=123456789abc",
onComplete:function(xmlhttp){
alert(xmlhttp.responseText)
}
}
);

調(diào)用的風格完全與原來相同！

目前這個新類只有兩個回調(diào)函數(shù)：onComplete 與 onError，Ajax類也只有Request一個方法，畢竟現(xiàn)在blog程序還不需要這么多應(yīng)用嘛。parameters 屬性有個默認值：{asynchronous:true,method:"GET",parameters:""}，可以從中知道，如果調(diào)用時不傳入asynchronous、method、parameters三個參數(shù)，那么類將使用默認值。

以上是“如何寫一個Ajax.Request類”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！