老铁们,还记得如何对原生ajax进行封装吗?注释较少,看看是否还能看的明白?
封装如下:
function ajax(obj){
//指定提交方式的默认值
obj.type = obj.type || "get";
//设置是否异步,默认为true(异步)
obj.async = obj.async || true;
//设置数据的默认值
obj.data = obj.data || null;
var params=_params(obj.data);
//在路径后面添加时间戳加随机数防止浏览器缓存。
obj.url+=(obj.url.indexOf("?")>-1?"&":"?")+"t="+((new Date()).getTime()+Math.random());
if(obj.type.toLowerCase()=="get" && params.length>0){//将转换后的data.与url进行拼接。
obj.url+="&"+params;
}
var xhr=new XMLHttpRequest();
xhr.open(obj.type,obj.url,obj.async);
if(obj.type.toLowerCase()=="post"){
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send(params)
}else
xhr.send(null);
if(obj.async){//异步调用
//监听响应状态。
xhr.onreadystatechange=function(){
if(xhr.readyState==4)//响应状态为4,数据加载完毕。
callback();
}
}else//同步
callback();
function callback(){
if(xhr.status==200){
obj.success(xhr.responseText);
}else{
obj.error(xhr.status);
}
}
//将对象序列化,将对象拼接成url字符串
function _params(data){
if(obj==null)
return obj;
var arr=[];
for(var i in data){
arr.push(encodeURIComponent(i) + '=' + encodeURIComponent(data[i]));
}
return arr.join("&");
}
}
调用如下:
ajax({
type:"get",
data:{
name:"laoliu"
},
url:"getUserByName.php",
async:false,
success:function(res){
//成功
},
error:function(error){
//失败
}
})
网友评论