Home > php教程 > php手册 > body text

复杂的ajax 原生js实现

WBOY
Release: 2016-06-07 11:44:25
Original
1014 people have browsed it

复杂的ajax实现
复杂的原生js ajax实现,加入了时间超时,超时处理模仿百度的js写的/**<br>  * 复杂的ajax封装<br>  * @version 1.0<br>  *<br>  * 用法<br>  *  var xmlhttp = new YAjax();<br>  *    xmlhttp.request({<br>  *         url : "./demo.php",  // get请求时 可以这样写 "./demo.php?name=zhangsan"<br>  *        method : "POST",<br>  *        data : "name=李四",  // 支持json传值 {"name":"zhangsan"}  get时不用该参数<br>  *        receiveType : "html",  // json html or xml<br>  *        timeout : 3000,  // 3秒<br>  *        success : function(d) {alert(d);},<br>  *        error : function(xmlhttp){alert('timeout');}<br>  *    });<br>  *<br>  */<br> function YAjax() {<br>     this._self = this;<br>     this.xmlhttp = this.init();<br> }<br> <br> YAjax.prototype = {<br>     constructor : YAjax,<br>     <br>     // 初始化xmlhttpRequest<br>     init : function() {<br>         var xmlhttp = null;<br>     <br>         // 针对不同浏览器建立这个对象的不同方式写不同代码<br>         if(window.XMLHttpRequest) {<br>             xmlhttp = new XMLHttpRequest();<br>             //针对某些特定版本的Mozillar浏览器的BUG进行修正<br>             if(xmlhttp.overrideMimeType) {<br>                 xmlhttp.overrideMimeType("text/xml");<br>             }<br>             <br>         } else if (window.ActiveXObject) {<br>             var activexName = ['MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];<br>             for (var i=0; i<activexname.length></activexname.length>                 try {<br>                     xmlhttp = new ActiveXObject(activexName[i]);<br>                     break;<br>                 } catch(e) {}<br>             }<br>         }<br>     <br>         return xmlhttp;<br>     },<br>     <br>     extend : function(destination, source, override) {<br>         if(undefined == override) override = true;<br>         if(typeof destination != "object" && typeof destination != "function") {<br>             if(!override) <br>                 return destination;<br>             else <br>                 destination = {};<br>         } <br>         var property = '';<br>         for(property in source) {<br>             if(override || !(property in destination)) {<br>                 destination[property] = source[property];<br>             }<br>         }<br>     <br>         return destination;    <br>     },<br>     <br>     // json to string {name: 'lisi', age: 10} --> name=lisi&age=10<br>     json2String : function(jsonData) {<br>         var strArr = [];<br>         for(var k in jsonData) {<br>             strArr.push(k + "=" + jsonData[k]);    <br>         }<br>             <br>         return strArr.join("&");<br>     },<br>     <br>     // 发送http 请求<br>     request : function(opt) {<br>         var _self = this,<br>             isTimeout = false,<br>             timeFlag = 0,<br>             options = {<br>                 url : "",   // string<br>                 data : "",  // json or string<br>                 method : "POST",<br>                 receiveType : "html",  // html json or xml<br>                 timeout : 7000,<br>                 async : true,<br>                 success : function(){alert("define your success function");},<br>                 error : function(xmlhttp){}<br>             };<br>         if("data" in opt) {<br>             if(typeof opt.data == "string"){} else {opt.data = this.json2String(opt.data); }    <br>         }<br>         options = this.extend(options, opt);<br>         <br>         this.xmlhttp.onreadystatechange = function(){<br>             if(_self.xmlhttp.readyState == 4) {<br>                 if(!isTimeout && _self.xmlhttp.status == 200) {<br>                     clearTimeout(timeFlag);<br>                     var t = options.receiveType.toLowerCase();<br>                     if(t == "html") {<br>                         options.success(_self.xmlhttp.responseText);<br>                         <br>                     } else if(t == "xml") {<br>                         options.success(_self.xmlhttp.responseXML);    <br>                         <br>                     } else if(t == 'json') {<br>                         try {<br>                             var obj = JSON.parse(_self.xmlhttp.responseText);<br>                             options.success(obj);    <br>                         } catch(e) {<br>                             var str = '(' + _self.xmlhttp.responseText + ')';  //json字符串<br>                             options.success(eval(str));<br>                         }<br>                     } else {}<br>                     <br>                 } else {<br>                     clearTimeout(timeFlag);<br>                     options.error(_self.xmlhttp);<br>                 }<br>             }<br>         };<br>         <br>         timeFlag = setTimeout(function(){<br>             if(_self.xmlhttp.readyState != 4) {<br>                 isTimeout = true;<br>                 _self.xmlhttp.abort();<br>                 clearTimeout(timeFlag);<br>              }    <br>         }, options.timeout);<br>         <br>         this.xmlhttp.open(options.method.toUpperCase(), options.url, options.async);  //打开与服务器连接<br>         if(options.method.toUpperCase() == "POST") {<br>             this.xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');  //post方式要设置请求类型<br>             this.xmlhttp.send(options.data);  //发送内容到服务器<br> <br>         } else {<br>                 this.xmlhttp.send(null);<br>         }<br>     }<br> };

AD:真正免费,域名+虚机+企业邮箱=0元

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template