本文实例讲述了一个简单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请求async有哪些方式?应该如何使用
html5+ajax文件上传进度条显示(图文详解)
以上就是ajax类库的使用方法的详细内容。
