jquer之ajaxQueue简单实现代码


Posted in Javascript onSeptember 15, 2011

没什么复杂的东西,就是用个array对象来做队列,维护ajax请求的顺序。下面给出代码:

;(function($) { 
$.ajaxQueue = { 
// 管理ajax请求的队列 
requests: new Array(), 
// 把待发送的ajax请求加入队列 
offer: function(options) { 
var _self = this, 
// 对complete,beforeSend方法进行“劫持”,加入队列处理方法poll 
xhrOptions = $.extend({}, options, { 
// 如果请求完成,发送下一个请求 
complete: function(jqXHR, textStatus) { 
if(options.complete) 
options.complete.call(this, jqXHR, textStatus); 
_self.poll(); 
}, 
// 如果请求被取消,继续发送下一个请求 
beforeSend: function(jqXHR, settings) { 
if(options.beforeSend) 
var ret = options.beforeSend.call(this, jqXHR, settings); 
if(ret === false) { 
_self.poll(); 
return ret; 
} 
} 
}); 
this.requests.push(xhrOptions); 
if(this.requests.length == 1) { 
$.ajax(xhrOptions); 
} 
}, 
// 用FIFO方式发送ajax请求 
poll: function() { 
if(this.isEmpty()) { 
return null; 
} 
var processedRequest = this.requests.shift(); 
var nextRequest = this.peek(); 
if(nextRequest != null) { 
$.ajax(nextRequest); 
} 
return processedRequest; 
}, 
// 返回队列头部的ajax请求 
peek: function() { 
if(this.isEmpty()) { 
return null; 
} 
var nextRequest = this.requests[0]; 
return nextRequest; 
}, 
// 判断队列是否为空 
isEmpty: function() { 
return this.requests.length == 0; 
} 
} 
})(jQuery);

使用的话就是$.ajaxQueue.offer(settings),settings的配置和jQuery文档的一致。
如果您感兴趣,可以点击我的jsFiddle share进行在线运行,修改等。最后有什么问题,欢迎提出交流 :)

Javascript 相关文章推荐
JS动画效果代码3
Apr 03 Javascript
cookie.js 加载顺序问题怎么才有效
Jul 31 Javascript
一个检测表单数据的JavaScript实例
Oct 31 Javascript
JavaScript原生对象之Number对象的属性和方法详解
Mar 13 Javascript
jquery append与appendTo方法比较
May 24 jQuery
JavaScript实现获取用户单击body中所有A标签内容的方法
Jun 05 Javascript
详解在Vue中有条件地使用CSS类
Sep 30 Javascript
vue组件详解之使用slot分发内容
Apr 09 Javascript
Vue+Express实现登录注销功能的实例代码
May 05 Javascript
基于vue实现探探滑动组件功能
May 29 Javascript
vue打包通过image-webpack-loader插件对图片压缩优化操作
Nov 12 Javascript
JS实现页面炫酷的时钟特效示例
Aug 14 Javascript
js substr、substring和slice使用说明小记
Sep 15 #Javascript
javascript 闭包
Sep 15 #Javascript
用JQuery模仿淘宝的图片放大镜显示效果
Sep 15 #Javascript
document.getElementById介绍
Sep 13 #Javascript
动态创建样式表在各浏览器中的差异测试代码
Sep 13 #Javascript
contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
Sep 13 #Javascript
jQuery中使用了document和window哪些属性和方法小结
Sep 13 #Javascript
You might like
删除PHP数组中的重复元素的实现代码
2017/04/10 PHP
Laravel中encrypt和decrypt的实现方法
2017/09/24 PHP
PHP迭代器接口Iterator用法分析
2017/12/28 PHP
PHP 代码简洁之道(小结)
2019/10/16 PHP
javascript 浏览器判断 绑定事件 arguments 转换数组 数组遍历
2009/07/06 Javascript
jQuery实现id模糊查询的小例子
2013/03/19 Javascript
js中一个函数获取另一个函数返回值问题探讨
2013/11/21 Javascript
禁止IE用右键的JS代码
2013/12/30 Javascript
js实现checkbox全选和反选示例
2014/05/01 Javascript
jQuery 判断图片是否加载完成方法汇总
2015/08/10 Javascript
JS基于clipBoard.js插件实现剪切、复制、粘贴
2016/05/03 Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
2017/02/17 Javascript
angular十大常见问题
2017/03/07 Javascript
vuex提交state&&实时监听state数据的改变方法
2018/09/16 Javascript
vue-cli的工程模板与构建工具详解
2018/09/27 Javascript
Python实现的Kmeans++算法实例
2014/04/26 Python
Python生成验证码实例
2014/08/21 Python
python实现的简单猜数字游戏
2015/04/04 Python
python3使用pyqt5制作一个超简单浏览器的实例
2017/10/19 Python
matplotlib savefig 保存图片大小的实例
2018/05/24 Python
python实现判断一个字符串是否是合法IP地址的示例
2018/06/04 Python
Python中应该使用%还是format来格式化字符串
2018/09/25 Python
wxPython电子表格功能wx.grid实例教程
2019/11/19 Python
python NumPy ndarray二维数组 按照行列求平均实例
2019/11/26 Python
Python yield生成器和return对比代码实例
2020/04/20 Python
HTML5之SVG 2D入门5—颜色的表示及定义方式
2013/01/30 HTML / CSS
新西兰最大的天然保健及护肤品网站:HealthPost(直邮中国)
2021/02/13 全球购物
物流管理专业大学生自荐信
2013/10/04 职场文书
银行自荐信范文
2013/10/07 职场文书
职业规划书如何设计?
2014/01/09 职场文书
社区禁毒工作方案
2014/06/02 职场文书
无房产证房屋转让协议书合同样本
2014/10/18 职场文书
感谢信模板大全
2015/01/23 职场文书
先进教师个人主要事迹材料
2015/11/03 职场文书
python中Tkinter 窗口之输入框和文本框的实现
2021/04/12 Python
一定要知道的 25 个 Vue 技巧
2021/11/02 Vue.js