一個簡單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 回調(diào)函數(shù),可選項
*/
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 參數(shù)值
* @param string resultHandle 回調(diào)函數(shù),可選項
*/
ajax.post('test.php', 'name=liruxing&email=liruxing1715@sina.com', function(data){
eval("var obj="+data);
alert(obj.name);
alert(obj.email);
})
// post 第二種格式,第二個參數(shù)為 Json 格式
ajax.post('test.php', {name:'李茹星',email:'liruxing1715@sina.com'}, function(data){
eval("var obj="+data);
alert(obj.name);
alert(obj.email);
})
</script>
更多關于ajax相關內(nèi)容感興趣的讀者可查看本站專題:《jquery中Ajax用法總結(jié)》、《JavaScript中ajax操作技巧總結(jié)》、《PHP+ajax技巧與應用小結(jié)》和《asp.net ajax技巧總結(jié)專題》
希望本文所述對大家ajax程序設計有所幫助。
相關文章
Ajax創(chuàng)建XMLHttp對象的完美兼容性代碼
Ajax創(chuàng)建XMLHttp對象的完美兼容性代碼,需要的朋友可以參考下。2011-11-11
ajax提交session超時跳轉(zhuǎn)頁面使用全局的方法來處理
如果session超時,而且是ajax請求,就會在響應頭里。再用一個全局的方法來處理,session超時要跳轉(zhuǎn)的頁面2013-11-11
springmvc 結(jié)合ajax批量新增的實現(xiàn)方法
這篇文章主要介紹了springmvc 結(jié)合ajax批量新增的實現(xiàn)方法,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-11-11
Ajax遍歷jSon后對每一條數(shù)據(jù)進行相應的修改和刪除(代碼分享)
這篇文章主要介紹了Ajax遍歷jSon后對每一條數(shù)據(jù)進行相應的修改和刪除的相關資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-11-11
關于Ajax異步請求后臺數(shù)據(jù)進行動態(tài)分頁功能
這篇文章主要介紹了Ajax異步請求后臺數(shù)據(jù)進行動態(tài)分頁功能,本文通過實例代碼給大家介紹的非常詳細,感興趣的朋友一起看看吧2018-06-06

