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

ホットAIツール

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

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

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

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

人気の記事

ホットツール

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

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

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

AtomエディタMac版ダウンロード
最も人気のあるオープンソースエディター

Dreamweaver Mac版
ビジュアル Web 開発ツール
