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自行引用,也可以自己改成你们项目里的,注意下我这提示用的返回字段也要更改成你们项目的
转载注明:http://www.cnblogs.com/zszs/p/7016606.html
jq ajax封装的更多相关文章
- 关于jq ajax封装以及error的报错参数
jq的ajax完整版本 $.ajax({ url: "GetCityByPId.ashx", data: {pId:pid}, dataType: "JSON" ...
- 关于jq ajax封装以及ajax上传Webapi
jq的ajax完整版本 $(function () { fileChange(); }); function fileChange() { $('#fileinput').change ...
- 原生Ajax 和Jq Ajax
前言:这次介绍的是利用ajax与后台进行数据交换的小例子,所以demo必须通过服务器来打开.服务器环境非常好搭建,从网上下载wamp或xampp,一步步安装就ok,然后再把写好的页面放在服务器中指定的 ...
- Javascript:来一个AJAX封装函数
前不久换工作了,最近一直在出差,忙得跟狗一样,所以博客都荒废许久了. 最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的—-但他又是基于 ...
- 妹味6:ajax与ajax封装
(功能)ajax能且仅能 从服务器读取文件 (环境)需要服务器环境才能测试,可以用工具建立本地服务器环境 (缓存)解决缓存问题:url加时间戳让每次请求地址唯一,如 url='abc.txt?t='+ ...
- ajax请求原理及jquery $.ajax封装全解析
.ajax原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其中最关键的一步就是从服务器获得 ...
- Ajax封装函数笔记
Ajax封装函数: function ajax(method, url, data, success) { //打开浏览器 //1.创建一个ajax对象 var xhr = null; try { x ...
- 原生ajax封装,包含post、method方式
原生ajax封装,包含post.method方式 function ajax(method, url, data, success) { var xhr = null; try { xhr = new ...
- Ajax工作原理和原生JS的ajax封装
前言: 之所以用ajax作为博客的开篇,是因为无论从ajax的出现还是从它的作用上来说,ajax对于前端无疑是意义重大的.甚至可以说,是ajax带来了前端这个行业.当然,历史并不能说明当下,曾经的辉煌 ...
随机推荐
- Noip2017 Day2 T1 奶酪
题目描述 现有一块大奶酪,它的高度为 h,它的长度和宽度我们可以认为是无限大的,奶酪中间有许多半径相同的球形空洞.我们可以在这块奶酪中建立空间坐标系,在坐标系中,奶酪的下表面为z =0,奶酪的上表面为 ...
- rocketmq-console修改logo,修改ip,修改port及完整编译安装图文版
一.下载源码到本地 这里使用IDEA,作为编译工具 https://gitee.com/mrliuNumberOne/rocketmq-externals.git 导入成功后如图: 二.Maven编译 ...
- Infor EAM:注重行业属性,实现对轨道交通线性资产的可视化管理
Infor EAM:注重行业属性,实现对轨道交通线性资产的可视化管理 企业得利,一要开源,二要节流.而企业资产管理的目的,也正是从资产的角度出发,一方面通过相关资源与活动的合理安排提高设备可利用率.增 ...
- MySql基础_DDL_DML_DQL(资料一)
今日内容 数据库的基本概念 MySQL数据库软件 安装 卸载 配置 SQL 数据库的基本概念 1. 数据库的英文单词: DataBase 简称 : DB 2. 什么数据库? * 用于存储和管理数据的仓 ...
- 记一次"截图"功能的项目调研过程!
目录 项目需求 功能调研 AWT Swing Html2Image PhantomJS Headless Chrome 实现方案 结论 项目需求 最近,项目接到了一个新需求,要求对指定URL进行后端模 ...
- Python列出指定目录下的子目录/文件或者递归列出
1.python只列出当前目录(或者指定目录)下的文件或者目录条目 import os files,dirs=[],[] for item in os.listdir(): if os.path.is ...
- Oracle学习(五)DBLINK
一.DBLINK学习 目的:为了解决跨库访问的需求. 场景如下:tnsnames.ora(oracle的库配置文件)下配置了2个库的环境地址,现在要实现跨库访问. PS:DBLINK和是否同一个主机无 ...
- (转)HttpServletResquest对象
HttpServletRequest对象代表客户端的请求,当客户端通过HTTP协议访问服务器时,HTTP请求头中的所有信息都封装在这个对象中,通过这个对象提供的方法,可以获得客户端请求的所有信息. 1 ...
- 使用deeplabv3+训练自己数据集(迁移学习)
概述 在前边一篇文章,我们讲了如何复现论文代码,使用pascal voc 2012数据集进行训练和验证,具体内容可以参考<deeplab v3+在pascal_voc 2012数据集上进行训练& ...
- Python练习题 039:Project Euler 011:网格中4个数字的最大乘积
本题来自 Project Euler 第11题:https://projecteuler.net/problem=11 # Project Euler: Problem 10: Largest pro ...