jQuery.ajax()方法笔记

1.快速查询jQuery之ajax方法对象参数的众多属性的作用

2.封装ajax方法的例子

3.与服务端互动参考 (与ASP.NET MVC互动)

1 $.ajax({
2   url: "test.html",
3   context: document.body
4 }).done(function() {
5   $( this ).addClass( "done" );
6 });

This object will be the context of all Ajax-related callbacks. 
用context设置的对象将成为ajax相关回调函数的上下文,如上面的例子,document.body这个DOM对象会成为第5行this对象的所指代的对象.

根据ajax 自定义reponse标识,封装回调函数, 如返回 {"success":true} 这样的JSON字符串,执行相应的回调部分

部分一: 定义原始成功回调函数,如下第9行至11行

 1 addTag: function (_data, fnError) {//在这里,调用addTag处,fnError未定义,但不影响addTag被调用
 2     return $.wzAjax({
 3         type: "post",
 4         url: "/api/tag/post",
 5         contentType: "application/json;charset=UTF-8",
 6         data: JSON.stringify(_data),
 7         dataType: "json",
 8         customErrorCb: fnError,//customErrorCb 自定义
 9         success: function (data,textStatus,jqXHR) {
10             console.log("addTag_success");
11         }
12     })
13 },

部分二

 1 $.wzAjax = function (requestParamObj) {
 2     var _fnError = requestParamObj.customErrorCb || function (reponseResult) {//fnError:由参数传入的自定义错误处理函数
 3         console.info(reponseResult);
 4         $.alert(reponseResult)
 5     }
 6     , _iniFnSuccess, _fnSuccess, dfd;  //当传入参数定义success时, _fnSuccess:根据response的结果,封装定义成功处理函数, _iniFnSuccess保留原定义的成功回调函数
 7     return requestParamObj.success ? (_iniFnSuccess = requestParamObj.success, //逻辑1,请求参数定义success, 即成功回调函数,
 8         _fnSuccess = function (_data, textStatus, _jqXHR) {
 9             _data.success != undefined && _data.success === !1 && _data.message ? _fnError(_data.message) : _iniFnSuccess(_data, textStatus, _jqXHR)//返回值没有定义success属性,运行_fnSuccess
10         },
11         requestParamObj.success = _fnSuccess,//重新绑定success回调函数,而原来的success回调函数
12         $.ajax(requestParamObj)) : (dfd = $.Deferred(), //逻辑2,没有定义成功回调函数时,即requestParamObj.success=false
13             $.ajax(requestParamObj).then(function (n, r, u) {
14                 //then 当只有一个参数时,表示done回调函数,即成功返回时的回调
15                 if (n.success != undefined && n.success === !1 && n.message) {
16                     _fnError(n.message);
17                 }
18                 else {
19                     return dfd.resolve(n, r, u)
20                 }
21             }
22                 // ,function(n,r,u){  
23                 //     return dfd.resolve(n, r, u)//返回调用点:wz_popup@936 getMyTags
24                 // }
25             ), //当有2个参数,程序执行到这
26             dfd.promise()) //返回新的Deferred对象
27 };

当浏览器加载上面的代码时JS引擎从上至下执行,即从第7行开始执行,第10行之前requestParamObj.success还是外部声明的自定义success回调函数

第8行,重新封装回调,赋值给第11行,第9行:内部再调用原success回调函数

运行时,$ajax执行成功,回调第8行_fnSuccess

理解参数dataType: "json"

从服务端response的数据由$.ajax()方法转成json格式,即无需再使用 var i = JSON.parse(_data); 进行处理