1.特点：在不改变原有的请求方法的情况下对$.ajax进行封装。
2.试用场景：
(1).不想每一次请求都写error:function(){}
(2).把请求的接口分成两部风前一部分（整个项目都不会变），后一个（会变），便于切换测试和上线环境。
等等。
/*
这种封装方法的思想：
在不改变原有请求方法的同时，对请求的参数进行改变。
*/
(function($) {
//1.得到$.ajax的对象 保存原来$.ajax的指向 其实是一个指针变量
var_ajax=$.ajax;
//重写$.ajax的方法
$.ajax=function(options) {
console.log(options.type);
//2.每次调用发送ajax请求的时候定义默认的error处理方法
varfn={
error:function(XMLHttpRequest,textStatus,errorThrown) {
alert("请求失败");
},
success:function(data,textStatus) {
console.log(data);
},
beforeSend:function(XHR) {
console.log("网络请求之前");
},
complete:function(XHR,TS) {
console.log("网络请求完成");
}
}
//3.如果在调用的时候写了error的处理方法，就不用默认的
if(options.error) {
fn.error=options.error;
}
if(options.success) {
fn.success=options.success;
}
if(options.beforeSend) {
fn.beforeSend=options.beforeSend;
}
if(options.complete) {
fn.complete=options.complete;
}
//4.扩展原生的$.ajax方法，返回最新的参数
var_options=$.extend(options, {
error:function(XMLHttpRequest,textStatus,errorThrown) {
fn.error(XMLHttpRequest, textStatus, errorThrown);
},
success:function(data,textStatus) {
fn.success(data, textStatus);
},
beforeSend:function(XHR) {
fn.beforeSend(XHR);
},
complete:function(XHR,TS) {
fn.complete(XHR,TS);
}
});
//5.将最新的参数传回ajax对象 这才是真正的发起网络请求
_ajax(_options);
};
})(jQuery);
外部调用
$.ajax({
type:"get",
url:"https://api.douban.com/v2/book/1220562",
async:true,
dataType:"jsonp"
});
注意事项：引用正确的jQuery库我这里是jquery-3.2.1.min.js
网友评论