一個(gè)簡(jiǎn)單Ajax類庫(kù)及使用方法實(shí)例分析
本文實(shí)例講述了一個(gè)簡(jiǎn)單Ajax類庫(kù)及使用方法。分享給大家供大家參考,具體如下:
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對(duì)象中有XMLHttpRequest存在就是非IE,包括(IE7,IE8) if(window.XMLHttpRequest){ request=new XMLHttpRequest(); if(request.overrideMimeType){ request.overrideMimeType("text/xml"); } //window對(duì)象中有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(); // 實(shí)例化對(duì)象,默認(rèn)為 HTTP,如果傳入 XML,返回 XML 對(duì)象 // Ajax 的 get 方法使用說(shuō)明 /** * function(targetUrl, resultHandle) * @param string targetUrl 傳遞過(guò)去的 URL 地址 * @param string resultHandle 回調(diào)函數(shù),可選項(xiàng) */ ajax.get('test.php?name=liruxing&email=liruxing1715@sina.com', function(data) { eval("var obj="+data); alert(obj.name); alert(obj.email); }); // Ajax 的 post 方法使用說(shuō)明 /** * function(targetUrl, sendString, resultHandle) * @param string targetUrl 傳遞過(guò)去的 URL 地址 * @param string sendString 參數(shù)值 * @param string resultHandle 回調(diào)函數(shù),可選項(xiàng) */ ajax.post('test.php', 'name=liruxing&email=liruxing1715@sina.com', function(data){ eval("var obj="+data); alert(obj.name); alert(obj.email); }) // post 第二種格式,第二個(gè)參數(shù)為 Json 格式 ajax.post('test.php', {name:'李茹星',email:'liruxing1715@sina.com'}, function(data){ eval("var obj="+data); alert(obj.name); alert(obj.email); }) </script>
更多關(guān)于ajax相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jquery中Ajax用法總結(jié)》、《JavaScript中ajax操作技巧總結(jié)》、《PHP+ajax技巧與應(yīng)用小結(jié)》和《asp.net ajax技巧總結(jié)專題》
希望本文所述對(duì)大家ajax程序設(shè)計(jì)有所幫助。
相關(guān)文章
零基礎(chǔ)學(xué)習(xí)AJAX之AJAX的簡(jiǎn)介和基礎(chǔ)
本系列我們將來(lái)逐步學(xué)習(xí)ajax,作為本系列的開(kāi)篇文章,我們還是俗套些,先來(lái)講解下ajax的簡(jiǎn)介和基礎(chǔ)知識(shí)吧。2015-01-01Ajax創(chuàng)建XMLHttp對(duì)象的完美兼容性代碼
Ajax創(chuàng)建XMLHttp對(duì)象的完美兼容性代碼,需要的朋友可以參考下。2011-11-11ajax提交session超時(shí)跳轉(zhuǎn)頁(yè)面使用全局的方法來(lái)處理
如果session超時(shí),而且是ajax請(qǐng)求,就會(huì)在響應(yīng)頭里。再用一個(gè)全局的方法來(lái)處理,session超時(shí)要跳轉(zhuǎn)的頁(yè)面2013-11-11springmvc 結(jié)合ajax批量新增的實(shí)現(xiàn)方法
這篇文章主要介紹了springmvc 結(jié)合ajax批量新增的實(shí)現(xiàn)方法,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-11-11Ajax遍歷jSon后對(duì)每一條數(shù)據(jù)進(jìn)行相應(yīng)的修改和刪除(代碼分享)
這篇文章主要介紹了Ajax遍歷jSon后對(duì)每一條數(shù)據(jù)進(jìn)行相應(yīng)的修改和刪除的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-11-11關(guān)于Ajax異步請(qǐng)求后臺(tái)數(shù)據(jù)進(jìn)行動(dòng)態(tài)分頁(yè)功能
這篇文章主要介紹了Ajax異步請(qǐng)求后臺(tái)數(shù)據(jù)進(jìn)行動(dòng)態(tài)分頁(yè)功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),感興趣的朋友一起看看吧2018-06-06