分享个自己的ajax封装
工作了也两年了，因为认真研读过 professional javascript for web developers 一书的翻译版，一直自以为自己js水平可以，因此工作中对于很多的js框架很不感冒，尽管也研究过这些框架，也认为确实很强大。自己工作中的遇到的就弄个自己的简单的实现，这个ajax的封装也主要代码是来自 professional javascript for web developers ，只是做了一些处理，对于应付自己工作的需求已是足够了。
首先，先展示一下怎样调用
//定义回调函数
function handleresponse(XMLHTTP)
{
if (XMLHTTP.readyState == 4) {
var response = XMLHTTP.responseText;
// 这里写自己的处理程序
}
}
}
function checktext(obj)
{
var url = "../Ashx/test.ashx";
customAjax("get",url,["title"],[obj.value],handleresponse);
}
说明一下，customAjax就是封装的对外提供的调用方法，第一参数是提交数据的方式，get或者post；第二个是提交的地址；第三个和第四个是数组，是要提交数据，第一个数组装键，后一个装值，必须相对应；最后一个就是回调函数了，自己定义。
调用还不算太麻烦，可能看来不太面向对象而已，不太习惯。
下面上代码：
// 创建xmlhttp对象
function CreateXMLHTTP()
{
var XMLHTTP;
if(window.ActiveXObject)
{
var arrSignature = ["MSXML2.XMLHTTP.6.0",“MSXML2.XMLHTTP.5.0",”MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0","MSXML2.XMLHTTP","Microsot.XMLHTTP"];
for(var i=0;i<arrSignature.length;i++)
{
try
{
XMLHTTP = new ActiveXObject(arrSignature[i]);
return XMLHTTP;
}
catch(oException)
{
}
}
throw new Error("MSXML is not installed on your IE.");
}
else if(window.XMLHttpRequest)
{
XMLHTTP = new XMLHttpRequest();
return XMLHTTP;
}
}
function addGETParam(sUrl,sParamName,sParamValue)
{
sUrl += ( sUrl.indexOf("?") == -1 ? "?" : "&");
sUrl += escape(sParamName) + "=" + escape(sParamValue);
return sUrl;
}
function addPOSTParam(sParams,sParamName,sParamValue)
{
sParams += ( sParams.length > 0 ? "&" : "" );
sParams += escape(sParamName) + "=" + escape(sParamValue);
return sParams;
}
// 主要的方法
function customAjax(sType,sUrl,arrParamName,arrParamValue,funStateChange)
{
var XMLHTTP = CreateXMLHTTP();
var sParams = "";
if( arrParamName instanceof Array && arrParamValue instanceof Array)
{
if(arrParamName.length == arrParamValue.length)
{
if(sType.toLowerCase() == "get")
{
sParams = null;
for(var i=0;i<arrParamName.length;i++)
sUrl = addGETParam(sUrl,arrParamName[i],arrParamValue[i]);
}
else if(sType.toLowerCase() == "post")
{
for(var i=0;i<arrParamName.length;i++)
sParams = addPOSTParam(sParams,arrParamName[i],arrParamValue[i]);
}
}
else
{
throw new Error("Two parma Array's length is not same.");
}
}
else
{
throw new Error("The third and fourth param must be Array.");
}
XMLHTTP.open(sType.toUpperCase(),sUrl,true);
if(funStateChange instanceof Function)
{
XMLHTTP.onreadystatechange = function(){funStateChange(XMLHTTP);} }
else
{ throw new Error("the last param must be Function."); }
XMLHTTP.send(sParams);
}
就是这么多，还不少，有一点要说是
["MSXML2.XMLHTTP.6.0",“MSXML2.XMLHTTP.5.0",”MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0","MSXML2.XMLHTTP","Microsot.XMLHTTP"]
在支持ie标准的浏览器上，有的电脑有可能会弹出让你加载MSXML2.XMLHTTP.6.0的提示，因为你的浏览器可能没有加载这个控件；如果你对自己的网站在用户电脑上这个提示不能容忍，那就把这个版本的检测从这个数组中删除，一般情况下，删除到4.0时，IE浏览器就不会有加载的提示了。如果你还不放心，仍可以继续删除到只剩下Microsot.XMLHTTP，其中jquery-1.3.2就是这样，以下是这个版本的jquery代码：
xhr:function(){
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
},
当然你如果嫌上面的创建过程太烦琐，也可以采用jquery这种方式。