日期:2014-05-16  浏览次数:20701 次

使用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()
{

     
}