一個簡單Ajax類庫及使用方法執行個體分析_AJAX相關

本文執行個體講述了一個簡單Ajax類庫及使用方法。分享給大家供大家參考，具體如下：

ajax.js

function Ajax(recvType){  var aj=new Object();  aj.recvType=recvType ? recvType.toUpperCase() : 'HTML' //HTML XML  aj.targetUrl='';  aj.sendString='';  aj.resultHandle=null;  aj.createXMLHttpRequest=function(){  var request=false;  //window對象中有XMLHttpRequest存在就是非IE，包括（IE7，IE8）  if(window.XMLHttpRequest){    request=new XMLHttpRequest();    if(request.overrideMimeType){      request.overrideMimeType("text/xml");    }  //window對象中有ActiveXObject屬性存在就是IE  }else if(window.ActiveXObject){    var versions=['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Msxml2.XMLHTTP.7.0','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];    for(var i=0; i<versions.length; i++){      try{        request=new ActiveXObject(versions[i]);        if(request){          return request;        }      }catch(e){        request=false;      }    }  }    return request;  }  aj.XMLHttpRequest=aj.createXMLHttpRequest();  aj.processHandle=function(){    if(aj.XMLHttpRequest.readyState == 4){      if(aj.XMLHttpRequest.status == 200){        if(aj.recvType=="HTML")          aj.resultHandle(aj.XMLHttpRequest.responseText);        else if(aj.recvType=="XML")          aj.resultHandle(aj.XMLHttpRequest.responseXML);      }    }  }  aj.get=function(targetUrl, resultHandle){    aj.targetUrl=targetUrl;    if(resultHandle!=null){      aj.XMLHttpRequest.onreadystatechange=aj.processHandle;      aj.resultHandle=resultHandle;    }    if(window.XMLHttpRequest){      aj.XMLHttpRequest.open("get", aj.targetUrl);      aj.XMLHttpRequest.send(null);    }else{      aj.XMLHttpRequest.open("get", aj.targetUrl, true);      aj.XMLHttpRequest.send();    }  }  aj.post=function(targetUrl, sendString, resultHandle){    aj.targetUrl=targetUrl;    if(typeof(sendString)=="object"){      var str="";      for(var pro in sendString){        str+=pro+"="+sendString[pro]+"&";      }      aj.sendString=str.substr(0, str.length-1);    }else{      aj.sendString=sendString;    }    if(resultHandle!=null){      aj.XMLHttpRequest.onreadystatechange=aj.processHandle;      aj.resultHandle=resultHandle;    }    aj.XMLHttpRequest.open("post", targetUrl);    aj.XMLHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");    aj.XMLHttpRequest.send(aj.sendString);  }  return aj;}

使用方法：

<script type="text/javascript">  var ajax = Ajax(); // 執行個體化對象，預設為 HTTP，如果傳入 XML，返回 XML 對象  // Ajax 的 get 方法使用說明  /**  * function(targetUrl, resultHandle)  * @param string targetUrl 傳遞過去的 URL 地址  * @param string resultHandle 回呼函數，可選項  */  ajax.get('test.php?name=liruxing&email=liruxing1715@sina.com', function(data) {    eval("var obj="+data);    alert(obj.name);    alert(obj.email);  });  // Ajax 的 post 方法使用說明  /**  * function(targetUrl, sendString, resultHandle)  * @param string targetUrl 傳遞過去的 URL 地址  * @param string sendString 參數值  * @param string resultHandle 回呼函數，可選項  */  ajax.post('test.php', 'name=liruxing&email=liruxing1715@sina.com', function(data){    eval("var obj="+data);    alert(obj.name);    alert(obj.email);  })  // post 第二種格式，第二個參數為 Json 格式  ajax.post('test.php', {name:'李茹星',email:'liruxing1715@sina.com'}, function(data){    eval("var obj="+data);    alert(obj.name);    alert(obj.email);  })</script>

更多關於ajax相關內容感興趣的讀者可查看本站專題：《jquery中Ajax用法總結》、《JavaScript中ajax操作技巧總結》、《PHP+ajax技巧與應用小結》和《asp.net ajax技巧總結專題》

希望本文所述對大家ajax程式設計有所協助。