欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  php教程

复杂的ajax 原生js实现

程序员文章站 2022-05-04 08:06:35
...
复杂的ajax实现
复杂的原生js ajax实现,加入了时间超时,超时处理模仿百度的js写的/**
* 复杂的ajax封装
* @version 1.0
*
* 用法
* var xmlhttp = new YAjax();
* xmlhttp.request({
* url : "./demo.php", // get请求时 可以这样写 "./demo.php?name=zhangsan"
* method : "POST",
* data : "name=李四", // 支持json传值 {"name":"zhangsan"} get时不用该参数
* receiveType : "html", // json html or xml
* timeout : 3000, // 3秒
* success : function(d) {alert(d);},
* error : function(xmlhttp){alert('timeout');}
* });
*
*/
function YAjax() {
this._self = this;
this.xmlhttp = this.init();
}

YAjax.prototype = {
constructor : YAjax,

// 初始化xmlhttpRequest
init : function() {
var xmlhttp = null;

// 针对不同浏览器建立这个对象的不同方式写不同代码
if(window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
//针对某些特定版本的Mozillar浏览器的BUG进行修正
if(xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType("text/xml");
}

} else if (window.ActiveXObject) {
var activexName = ['MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];
for (var i=0; i try {
xmlhttp = new ActiveXObject(activexName[i]);
break;
} catch(e) {}
}
}

return xmlhttp;
},

extend : function(destination, source, override) {
if(undefined == override) override = true;
if(typeof destination != "object" && typeof destination != "function") {
if(!override)
return destination;
else
destination = {};
}
var property = '';
for(property in source) {
if(override || !(property in destination)) {
destination[property] = source[property];
}
}

return destination;
},

// json to string {name: 'lisi', age: 10} --> name=lisi&age=10
json2String : function(jsonData) {
var strArr = [];
for(var k in jsonData) {
strArr.push(k + "=" + jsonData[k]);
}

return strArr.join("&");
},

// 发送http 请求
request : function(opt) {
var _self = this,
isTimeout = false,
timeFlag = 0,
options = {
url : "", // string
data : "", // json or string
method : "POST",
receiveType : "html", // html json or xml
timeout : 7000,
async : true,
success : function(){alert("define your success function");},
error : function(xmlhttp){}
};
if("data" in opt) {
if(typeof opt.data == "string"){} else {opt.data = this.json2String(opt.data); }
}
options = this.extend(options, opt);

this.xmlhttp.onreadystatechange = function(){
if(_self.xmlhttp.readyState == 4) {
if(!isTimeout && _self.xmlhttp.status == 200) {
clearTimeout(timeFlag);
var t = options.receiveType.toLowerCase();
if(t == "html") {
options.success(_self.xmlhttp.responseText);

} else if(t == "xml") {
options.success(_self.xmlhttp.responseXML);

} else if(t == 'json') {
try {
var obj = JSON.parse(_self.xmlhttp.responseText);
options.success(obj);
} catch(e) {
var str = '(' + _self.xmlhttp.responseText + ')'; //json字符串
options.success(eval(str));
}
} else {}

} else {
clearTimeout(timeFlag);
options.error(_self.xmlhttp);
}
}
};

timeFlag = setTimeout(function(){
if(_self.xmlhttp.readyState != 4) {
isTimeout = true;
_self.xmlhttp.abort();
clearTimeout(timeFlag);
}
}, options.timeout);

this.xmlhttp.open(options.method.toUpperCase(), options.url, options.async); //打开与服务器连接
if(options.method.toUpperCase() == "POST") {
this.xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); //post方式要设置请求类型
this.xmlhttp.send(options.data); //发送内容到服务器

} else {
this.xmlhttp.send(null);
}
}
};

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