検索
ホームページphp教程php手册复杂的ajax 原生js实现

复杂的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元

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

PhpStorm Mac バージョン

PhpStorm Mac バージョン

最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

SublimeText3 英語版

SublimeText3 英語版

推奨: Win バージョン、コードプロンプトをサポート!

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール