//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自行引用,也可以自己改成你们项目里的,注意下我这提示用的返回字段也要更改成你们项目的

转载注明:http://www.cnblogs.com/zszs/p/7016606.html

jq ajax封装的更多相关文章

  1. 关于jq ajax封装以及error的报错参数

    jq的ajax完整版本 $.ajax({ url: "GetCityByPId.ashx", data: {pId:pid}, dataType: "JSON" ...

  2. 关于jq ajax封装以及ajax上传Webapi

    jq的ajax完整版本 $(function () {     fileChange(); }); function fileChange() {     $('#fileinput').change ...

  3. 原生Ajax 和Jq Ajax

    前言:这次介绍的是利用ajax与后台进行数据交换的小例子,所以demo必须通过服务器来打开.服务器环境非常好搭建,从网上下载wamp或xampp,一步步安装就ok,然后再把写好的页面放在服务器中指定的 ...

  4. Javascript:来一个AJAX封装函数

    前不久换工作了,最近一直在出差,忙得跟狗一样,所以博客都荒废许久了. 最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的—-但他又是基于 ...

  5. 妹味6:ajax与ajax封装

    (功能)ajax能且仅能 从服务器读取文件 (环境)需要服务器环境才能测试,可以用工具建立本地服务器环境 (缓存)解决缓存问题:url加时间戳让每次请求地址唯一,如 url='abc.txt?t='+ ...

  6. ajax请求原理及jquery $.ajax封装全解析

    .ajax原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其中最关键的一步就是从服务器获得 ...

  7. Ajax封装函数笔记

    Ajax封装函数: function ajax(method, url, data, success) { //打开浏览器 //1.创建一个ajax对象 var xhr = null; try { x ...

  8. 原生ajax封装,包含post、method方式

    原生ajax封装,包含post.method方式 function ajax(method, url, data, success) { var xhr = null; try { xhr = new ...

  9. Ajax工作原理和原生JS的ajax封装

    前言: 之所以用ajax作为博客的开篇,是因为无论从ajax的出现还是从它的作用上来说,ajax对于前端无疑是意义重大的.甚至可以说,是ajax带来了前端这个行业.当然,历史并不能说明当下,曾经的辉煌 ...

随机推荐

  1. 鸿蒙真的是套壳吗?HarmonyOS应用开发初体验,Java原生和JavaScript的mvvm开发

    初探寻鸿蒙os的应用开发 本期视频已发布到bilibili 注意是应用开发,没错码农(应用开发)一般关注这个就行了 IDE 点击应用开发以后,点击链接下载IDE,DevEco Studio是基于IDE ...

  2. Java文件操作API功能与Windows DOS命令和Linux Shell 命令类比

    Java文件操作API功能与Windows DOS命令和Linux Shell 命令类比: Unix/Linux (Bash) Windows(MS-DOS) Java 进入目录 cd cd - 创建 ...

  3. 微服务电商项目发布重大更新,打造Spring Cloud最佳实践!

    Spring Cloud实战电商项目mall-swarm地址:转发+关注 私信我获取地址 系统架构图   系统架构图 项目组织结构 mall├── mall-common-- 工具类及通用代码模块├─ ...

  4. EasyUI 日期控件赋值

    $("#BillDateE").datebox("setValue", '2020/9/28'); $("#BillDateB").date ...

  5. Android Studio 自定义字体显示英文音标

    android:fontFamily="serif" 网上查了很多自定义字体的方式,或多或少都有些麻烦,最后还是尝试着认为内置字体不应该实现不了英文音标问题,就一个一个字体试了一下 ...

  6. java版集成Allure报告--注释使用说明

    testNG集成Allure报告--注释使用说明 前置条件 首先需要下载allure的zip包解压,然后配置环境变量即可(win).allure的GitHub下载地址: 然后执行testn.xml或者 ...

  7. React学习小记--setState的同步与异步

    react中,state不能直接修改,而是需要使用setState()来对state进行修改,那什么时候是同步而什么时候是异步呢? 基础代码: setCounter = (v) => { thi ...

  8. 在KEIL下查看单片机编程内存使用情况

    原文链接:https://blog.csdn.net/D_azzle/article/details/83410141 截至到目前为止,本人接触单片机也有将近一年的时间.这一年以来也接触过了很具代表性 ...

  9. 00 在Windows环境中开发Cordova项目的准备工作

    1.开发环境准备:     安装nodejs     安装Cordova     安装Visual Studio Code     安装nodejs步骤:     通过nodejs官网(https:/ ...

  10. javaFX 在窗口的标题栏显示当前时间,1秒更新一次时间

    例1:在窗口的标题栏显示当前时间,1秒更新一次时间 1 import java.text.DateFormat; 2 import java.text.SimpleDateFormat; 3 impo ...