再次封装ajax函数,统一入口
根据API写网页的时候,每个页面都需要ajax请求,每次都写一大堆请求,配置什么的太麻烦,于是打算封装一个ajax函数,统一调用:
开始时是使用return返回ajax,如下:
function createAjax(ajaxrequire) {
_url = ajaxrequire._urls;
_dataType = ajaxrequire._dataType;
_async = ajaxrequire._async
_method = ajaxrequire._method;
_data = ajaxrequire._data;
_data.token = token;
_data.device = 'weixin';
return $.ajax({
url: _url,
dataType: _dataType,
cache: false,
async: _async,
type: _method,
data: _data,
timeout:10000,
error:function(data){
mui.alert(data.msg);
}
});
}
在如下Ogoods变量中填好需要的参数内容,然后就可以直接调用了
var Ogoods = {
_urls:'api地址',
_data:{ },
_method:'post',
_dataType:'json',
_async:false
};
var data = JSON.parse(createAjax(Ogoods).responseText);
变量data中保存着ajax请求返回的数据,但是这个方法有个bug,就是不能使用异步,当 async为true时会报错,也不知道是不是只是我写的有问题,
于是考虑着还能不能用其他方式实现,嗯,写个回调函数应该就行了,
$packageAjax = function (ajaxrequire,callback) {
_url = ajaxrequire._urls;
_dataType = ajaxrequire._dataType;
_async = ajaxrequire._async
_method = ajaxrequire._method;
_data = ajaxrequire._data;
_data.token = token;
_data.device = 'weixin';
$.ajax({
url: _url,
dataType: _dataType,
cache: false,
async: true,
type: _method,
data: _data,
timeout:10000,
success:function(data){
callback(data);
},
error:function(data){
mui.alert(data.msg);
}
});
}
调用:
var Ogoods = {
_urls:'api地址',
_data:{ },
_method:'post',
_dataType:'json',
_async:true
};
$packageAjax(Ogoods,function(data){
//执行操作
})
这样ajax设为异步就没什么问题了,并且也不必每次都写配置选项了,很简单,却也实用。
再次封装ajax函数,统一入口的更多相关文章
- 轻松搞定Ajax(分享下自己封装ajax函数,其实Ajax使用很简单,难是难在你得到数据后来怎样去使用这些数据)
hey,guys!今天我们一起讨论下ajax吧!此文只适合有一定ajax基础,但还是模糊状态的同志,当然高手也可以略过~~~ 一.概念 Ajax(Asynchronous Javascript + X ...
- 使用promise手动封装ajax函数
最近在做一个单页应用,node和浏览器仅通过json传输数据,因为是只有自己用等于是锻炼一下自己,所以也不用考虑seo的问题,node端我已经写好了,但是浏览器端想要用ajax原生太麻烦,用封装的函数 ...
- 封装ajax函数
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title> ...
- 使用jquery再次封装ajax
$.fn.ajaxSend = function (type, url, postdata, onSuccess) { $.ajax({ async: false, url: url, type: t ...
- 04.封装ajax
<script> //封装ajax // 函数名 ajax // 函数的参数 // url: 请求的地址 // type: 请求的方式 get /post // data: 要上传的数据 ...
- 原生JS封装ajax方法
http://blog.sucaijiayuan.com/article/89 jquery框架的ajax方法固然好用,但是假如某天我们的项目不能引入jquery或项目需求很简单,没有很多交互功能,只 ...
- 自封装ajax
项目中有时候用不到jq,需要了解xmlhttp原理,自己写一套函数请求和发送数据! /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET ...
- ajax 原生js封装ajax [转]
/* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @ ...
- ajax的再次封装!(改进版) —— new与不 new 有啥区别?
生命不息重构不止! 上一篇写了一下我对ajax的再次封装的方法,收到了很多有价值的回复,比如有童鞋建议用$.extend,一开始还以为要做成插件呢,后来才知道,原来这个东东还可以实现合并.省着自己再去 ...
随机推荐
- 戏说 .NET GDI+系列学习教程(三、Graphics类的应用_验证码扩展)
从别人那拷贝的 #region 定义和初始化配置字段 //用户存取验证码字符串 public string validationCode = String.Empty; //生成的验证码字符串 pub ...
- UVA 10005 Packing polygons(最小圆覆盖)
裸的模板题 AC代码: #include<cstdio> #include<cmath> #include<algorithm> #include<iostr ...
- Vue 学习笔记之 —— 组件(踩了个坑)
最近在学习vue,学习组件时,遇到了一个问题,困扰了半个多小时.. <!DOCTYPE html> <html lang="en"> <head> ...
- 前端(十四)—— JavaScript常用类:Number、Date类、字符串、数组、Math类、正则
JS常用类:Number类.Date类.Math类.字符串.数组.正则 一.Number 1.常用数字 整数:10 小数:3.14 科学计数法:1e5 | 1e-5 正负无穷:Infinity | - ...
- js模块化的历史
了解模块化开发的历史,可以帮助我们理解 模块化开发的形式是怎么样的,对我们深入学习模块化开发会有很大的帮助: 一.服务器端JS的模块化 nodeJS的出现 ------官网: http://nod ...
- usb-host与外设通信(三)
4.与设备之间的通信 和USB设备通信可以是同步的或者是异步的,无论是哪一种情况,你都应该创建一个新的线程来处理数据传输,这样才不会使UI线程出现阻塞.与设备建立适宜的通信,你需要获得该设备一个合适的 ...
- mongo之$group+$addToSet
直接举例说明 #ArrangingResult表结构 { "_id" : ObjectId("5acc739df78bf21f8c94f080"), " ...
- BOM的构成
1.DOM 和 BOM 的区别 DOM:文档对象模型,把[文档]当做一个[对象]来看待,DOM的顶级对象是document 主要学习的是操作页面元素,DOM 是 W3C 的标准规范 BOM:浏览器对象 ...
- 微信小程序-云开发
云开发 初始化 wx.cloud.init({ env: 'test-x1dzi' }) 云数据库 数据类型 String,Number,Boolean,Array,Object,Date,GeoPo ...
- 【JZOJ3294】【BZOJ4417】【luoguP3990】超级跳马
description analysis 矩阵乘法好题 最朴素的\(10pts\)的\(f[i][j]\)容易\(DP\),但是是\(O(nm^2)\)的复杂度 于是把\(10\)分的\(DP\)写出 ...