使用AJax的过程
除了用网上介绍的AJax的库外,可以自己写一个简单的AJax库,方便易修改。
首先,使用Ajax的步骤可以归结为:
1.创建请求
ajaxreq = new XMLHttpRequest();
2.打开URL
ajaxreq.open("GET","filename");
3.发送请求
ajaxreq.send(null);
4.等待响应,XMLHttpRequest对象为此专门提供了名为onreadystatechange的事件处理程序,用户可以自行创建一个处理函数,并将它作为该事件的处理程序。
ajaxreq.onreadystatechange = myFunc;
requst对象拥有一个名为readyState的属性,代表一个请求的当前状态,当readyState属性发生变化时,该事件将被触发,ReadyState的属性值的变化范围如下:0代表新的请求,4代表已结束的请求,而且当一个请求成功后,status属性将被设置为200,或者如果发生错误,将被设置成相应的错误代码,同时,与错误相关的解释信息,将被保存在statusText属性中。
5.解释响应数据
可以通过两个属性进一步地访问来自服务器的返回数据,这两个属性分别是responseText和responseXML。
下面贴上一个简单Ajax库的代码:
var ajaxreq = false;
var ajaxCallback;
function ajaxRequest(filename)
{
try{
ajaxreq = new XMLHttpRequest();
//alert("in");
}catch(error)
{
try{
ajaxreq = new ActiveXObject("Microsoft.XMLHTTP");
}catch(error)
{
alert("error");
return false;
}
}
ajaxreq.open("GET",filename);
ajaxreq.onreadystatechange = ajaxResponse;
ajaxreq.send(null);
}
function ajaxResponse()
{
if(ajaxreq.readyState !=4)
{
//alert("!=4");
return;
}
if(ajaxreq.status == 200)
{
if(ajaxCallback)
{
ajaxCallback();
}
}
else
{
alert("Request failed:"+ajaxreq.statusText);
}
return true;
}
当使用此Ajax库时,使用以下语句:
function route()
{
var filename = "RouteServlet?s_point="+start_point2+"&e_point="+end_point2;
ajaxCallback = handleResult;
ajaxRequest(filename);
}
function handleResult()
{
}