尽管现在的ajax框架很多,但我们通常用不了那么多功能,如果仅是为了一个简单的功能去使用诸入dojo、prototype、yui等框架,未免小题大做,这里,我仅从服务器端获取数据这一最常用的功能出发,分离并整理出了这个函数,使用时非常方便,供大家参考。

/**//** myajax.js
* AJAX对象封装
* @author: kevon
* @date: 2007-07-27
* 注:本文件的最后附有使用示例
*/


function $(obj)...{return document.getElementById(obj);}

this.xml=false;//是否传回xml格式的数据
this.asynchronous=true;//是否异步


/**//** url:路径
* pars:参数
* showResponse:处理函数
* showResponse的格式为aa
* 注:aa为函数名
*/
myajax = function(url,pars,showResponse,xml)

...{
if(typeof(xml)!="undefined" && xml.toLowerCase()=="xml")
this.xml=true;
if (pars.length > 0)
url += (url.match(/?/) ? '&' : '?') + pars;
if(typeof(showResponse)!="undefined")
this.callBack=showResponse;

try ...{
req = xmlHTTP();

} catch(e) ...{
req = false;
}
req.onreadystatechange = processRequest;
req.open("GET",url,this.asynchronous);
req.send(null);
}

//创建XMLHttpRequest对象

xmlHTTP = function() ...{
var xmlHTTP;
var msxmlhttp = new Array(
'Msxml2.XMLHTTP.5.0',
'Msxml2.XMLHTTP.4.0',
'Msxml2.XMLHTTP.3.0',
'Msxml2.XMLHTTP',
'Microsoft.XMLHTTP');

for (var i = 0; i < msxmlhttp.length; i++) ...{

try ...{
xmlHTTP = new ActiveXObject(msxmlhttp[i]);

} catch (e) ...{
xmlHTTP = null;
}
}
if(!xmlHTTP && typeof XMLHttpRequest != "undefined")
xmlHTTP = new XMLHttpRequest();
return xmlHTTP;
}

// 处理返回信息的函数

function processRequest() ...{

if (req.readyState == 4) ...{ // 判断对象状态

if (req.status == 200 && req.statusText == "OK") ...{ // 信息已经成功返回,开始处理信息
if(typeof(callBack)=="function")
if(xml)
callBack(req.responseXML);
else
callBack(req.responseText);

} else ...{ //页面不正常
alert("您所请求的页面有异常。");
}
}
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Ajax</title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script src="myajax.js"></script>

<script language="JavaScript">...
<!--

function processReal(responseText)...{
$("spanPaiming").innerHTML=responseText;

//var result = responseText.getElementsByTagName("info")[0].text;//处理以xml格式返回的数据
//alert(result);
}

function doPaiming() ...{
var baojia = $("txtBaojia").value;

if(baojia=="" || baojia==null) ...{
window.alert("不能为空。");
$("txtBaojia").focus();
return false;
}

else ...{
$("spanBao").innerHTML=baojia;
var url='test.asp';
var pars='baojia='+baojia;
var callback=processReal;

//如果要返回xml格式的,请加上下面这行
//this.xml=true;//缺省为false(以text的方式返回信息),另外,this.xml=true与myajax(url,pars,callback,'xml')这种方式等价;
//ajax调用
myajax(url,pars,callback);
//myajax(url,pars);
}
}
//-->
</script>
</head>

<body>
<form>
<div>请输入数值<input id="txtBaojia" maxlength="8" onkeyup="value=(/^(+)?d+($|.d+$)/.test( value +'0' ))? value : value.replace(/[^d]/g,'');" />
<input type="button" onclick="doPaiming()" value="在服务器端计算" /></div>
<div style="bgcolor:#fafcea">
您输入的是[<span id="spanBao" ></span>],除2之后是[<span id="spanPaiming" ></span>]。
</div>
</form>
</body>
</html>
用最常用的ASP来处理客户端的请求,当然,你可以随便用其他的服务器端语言,这个页面太简单了,你可以很轻松的改成其他语言,修改之后你记得改show.html中的url,这里是(test.asp)。
给出一个示例






















































































show.html


























































<%
Dim s
s=request("baojia")
s=s/2
Response.write(s)
Response.End()
%>
<%
'下面的是xml方式输出,传递xml格式的用这种
'Response.ContentType="text/xml"
'response.Write("<?xml version='1.0' encoding='GB2312' ?>")
'response.Write("<root>")
'response.Write("<info>love you</info>")
'response.Write("</root>")
%>
Dim s
s=request("baojia")
s=s/2
Response.write(s)
Response.End()
%>
<%
'下面的是xml方式输出,传递xml格式的用这种
'Response.ContentType="text/xml"
'response.Write("<?xml version='1.0' encoding='GB2312' ?>")
'response.Write("<root>")
'response.Write("<info>love you</info>")
'response.Write("</root>")
%>
注:方法并非越通用越好,最适合自己的才是最好的。文中使用的返回数据类型可以自由指定,默认是responseText,你如果想用xml的话照注释做就可以,随你了,适用就好。