jq ajax封装
Posted 小奉手
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jq ajax封装相关的知识,希望对你有一定的参考价值。
//ajax公共方法,zs 2017-06-14 $.extend({ //比jq的ajax多了的参数: //salert是否在请求成功后弹出后台的SuressStr字段值 //ealertStr:请求出错 majax: function (a) { if (typeof a === "object") { var defaultOption = { url: "", async: true, cache: true,//dataType 为 script 和 jsonp 时默认为 false。设置为 false 将不缓存此页面。 data: null, type: "get", timeout: null, dataType: "",//预期服务器返回的数据类型 contentType: "application/x-www-form-urlencoded",//发送信息至服务器时内容编码类型。 beforeSend: function (XMLHttpRequest) { // console.log("请求开始"); }, //dataFilter: function (data, type) { // console.log("请求成功success之前"); //dataFilter给Ajax返回的原始数据的进行预处理的函数。它的调用在success之前 //测试1.10.2和2.0.3版本的js如果存在此方法则success不会执行。会直接到error方法里,虽然状态码是200 //}, success: function (data, textStatus, jqXHR) { // console.log("请求成功"); }, error: function (XMLHttpRequest, textStatus, errorThrown) { // console.log("请求出错"); }, complete: function (XMLHttpRequest) { //在error或success之前执行 // console.log("无论成功错误我都存在"); }, context: null,//这个对象用于设置 Ajax 相关回调函数的上下文。也就是说,让回调函数内 this 指向这个对象 global: true,//是否触发全局 AJAX 事件。默认值: true。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。 ifModified: false,//仅在服务器数据改变时获取新数据。默认值: false。使用 HTTP 包 Last-Modified 头信息判断。在 jQuery 1.4 中,它也会检查服务器指定的 \'etag\' 来确定数据没有被修改过。 jsonp: "", jsonpCallback: "", username: null, password: null, processData: true, scriptCharset: "", traditional: false,// 默认的话,traditional为false,即jquery会深度序列化参数对象,不深度序列化的例子:data:{ p: ["123", "456", "789"] },p会序列化成 p=123&p=456&p=456。深度序列化例子:data:{foo:["bar1", "bar2"]} 转换为 \'&foo=bar1&foo=bar2\'。 //xhr: function () { //测试会导致返回的status为0 //}, //自加参数 eAlertStr: "",//请求出错弹出的内容 eAlertStrOrder: false,//eAlertStr弹出的顺序,false表示在error方法执行完毕之后弹出 sAlert: false,//请求成功后是否弹出后台返回的SuccessStr字段的内容,必须确定后台返回的是能序列化的json sAlertOrder: false,//sAlert弹出的顺序,false表示在success方法执行完毕之后弹出 execomplete: function (data, textStatus, jqXHR) { //success或error方法执行完毕,success时该方法的参数才有值 // console.log("方法执行完毕了"); } } for (i in a) { defaultOption[i] = a[i]; } $.ajax({ url: defaultOption.url, async: defaultOption.async, cache: defaultOption.cache, data: defaultOption.data, type: defaultOption.type, timeout: defaultOption.timeout, dataType: defaultOption.dataType, contentType: defaultOption.contentType, beforeSend: function (XMLHttpRequest) { defaultOption.beforeSend(XMLHttpRequest); }, //dataFilter: function (data, type) { // defaultOption.dataFilter(data, type); //}, success: function (data, textStatus, jqXHR) { var i = true; var datas = data; if (defaultOption.sAlert && typeof data != "object") { datas = JSON.parse(data); } if (defaultOption.sAlert && defaultOption.sAlertOrder && datas.SuccessStr != null && datas.SuccessStr != "undefined" && $.trim(datas.SuccessStr) != "") { $.gritter.add({ title: "提示", text: datas.SuccessStr, class_name: \'gritter-success \' }); i = false; } if (!i) { setTimeout(function () { defaultOption.success(data, textStatus, jqXHR); defaultOption.execomplete(data, textStatus, jqXHR); }, 400); } else { defaultOption.success(data, textStatus, jqXHR); if (i && defaultOption.sAlert && datas.SuccessStr != null && datas.SuccessStr != "undefined" && $.trim(datas.SuccessStr) != "") { $.gritter.add({ title: "提示", text: datas.SuccessStr, class_name: \'gritter-success \' }); } setTimeout(function () { defaultOption.execomplete(data, textStatus, jqXHR); }, 400); } }, error: function (XMLHttpRequest, textStatus, errorThrown) { var i = true; if (defaultOption.eAlertStrOrder && defaultOption.eAlertStr != null && defaultOption.eAlertStr != "undefined" && $.trim(defaultOption.eAlertStr) != "") { $.gritter.add({ title: "提示", text: defaultOption.eAlertStr, class_name: \'gritter-error \' }); i = false; } if (!i) { setTimeout(function () { defaultOption.error(XMLHttpRequest, textStatus, errorThrown); defaultOption.execomplete(data, textStatus, jqXHR); }, 400); } else { defaultOption.error(XMLHttpRequest, textStatus, errorThrown); if (i && defaultOption.eAlertStr != null && defaultOption.eAlertStr != "undefined" && $.trim(defaultOption.eAlertStr) != "") { $.gritter.add({ title: "提示", text: defaultOption.eAlertStr, class_name: \'gritter-error \' }); setTimeout(function () { defaultOption.execomplete(data, textStatus, jqXHR); }, 400); } } }, complete: function (XMLHttpRequest) { defaultOption.complete(XMLHttpRequest); }, context: defaultOption.context, global: defaultOption.global, ifModified: defaultOption.ifModified, jsonp: defaultOption.jsonp, jsonpCallback: defaultOption.jsonpCallback, username: defaultOption.username, password: defaultOption.password, processData: defaultOption.processData, scriptCharset: defaultOption.scriptCharset, traditional: defaultOption.traditional, //xhr: function () { // defaultOption.xhr(); //} }); } else { console.log("参数格式不正确"); } }, mpost: function (url, data, callback, type) { if (jQuery.isFunction(data)) { type = type || callback; callback = data; data = undefined; } return $.majax({ url: url, type: "post", dataType: type, data: data, success: callback }); }, mget: function (url, data, callback, type) { if (jQuery.isFunction(data)) { type = type || callback; callback = data; data = undefined; } return $.majax({ url: url, type: "get", dataType: type, data: data, success: callback }); }, });
成功的提示的插件为 $.gritter自行引用,也可以自己改成你们项目里的,注意下我这提示用的返回字段也要更改成你们项目的
以上是关于jq ajax封装的主要内容,如果未能解决你的问题,请参考以下文章