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 相关文章推荐
javascript 解析url的search方法
Feb 09 Javascript
js下用层来实现select的title提示属性
Feb 23 Javascript
jquery右下角弹出提示框示例代码
Oct 08 Javascript
在页面上用action传递参数到后台出现乱码的解决方法
Dec 31 Javascript
清除div下面的所有标签的方法
Feb 17 Javascript
JavaScript实现可拖拽的拖动层Div实例
Aug 05 Javascript
javascript实现可键盘控制的抽奖系统
Mar 10 Javascript
three.js中3D视野的缩放实现代码
Nov 16 Javascript
Vue 菜单栏点击切换单个class(高亮)的方法
Aug 22 Javascript
小程序实现新用户判断并跳转激活的方法
May 20 Javascript
vue实现的请求服务器端API接口示例
May 25 Javascript
vue基于Teleport实现Modal组件
May 31 Vue.js
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生成excel列序号代码实例
2013/12/24 PHP
php语言的7种基本的排序方法
2020/12/28 PHP
PHP简单实现冒泡排序的方法
2016/12/26 PHP
PHP 实现浏览记录并按日期分组
2017/05/11 PHP
JavaScript Cookie显示用户上次访问的时间和次数
2009/12/08 Javascript
js中eval详解
2012/03/30 Javascript
jquery动画3.创建一个带遮罩效果的图片走廊
2012/08/24 Javascript
JQuery中clone方法复制节点
2015/05/18 Javascript
深入理解jQuery中的事件冒泡
2016/05/24 Javascript
jQuery Validate设置onkeyup验证的实例代码
2016/12/09 Javascript
JS正则子匹配实例分析
2016/12/22 Javascript
Node.js 基础教程之全局对象
2017/08/06 Javascript
JavaScript代码执行的先后顺序问题
2017/10/29 Javascript
使用vue实现grid-layout功能实例代码
2018/01/05 Javascript
jQuery选择器选中最后一个元素,倒数第二个元素操作示例
2018/12/10 jQuery
vue总线机制(bus)知识点详解
2020/05/10 Javascript
Javascript基于OOP实实现探测器功能代码实例
2020/08/26 Javascript
[02:44]完美大师赛主赛事淘汰赛第二日观众采访
2017/11/24 DOTA
python批量制作雷达图的实现方法
2016/07/26 Python
Python进阶之@property动态属性的实现
2019/04/01 Python
python中matplotlib条件背景颜色的实现
2019/09/02 Python
python集合删除多种方法详解
2020/02/10 Python
对django 2.x版本中models.ForeignKey()外键说明介绍
2020/03/30 Python
Python OpenCV实现测量图片物体宽度
2020/05/27 Python
美津浓美国官网:Mizuno美国
2018/08/07 全球购物
护理学专业推荐信
2013/12/03 职场文书
办加油卡单位介绍信
2014/01/09 职场文书
城建学院毕业生自荐信
2014/01/31 职场文书
致跳远运动员加油稿
2014/02/11 职场文书
学习党的群众路线教育实践活动心得体会范文
2014/11/03 职场文书
2015年中秋节活动总结
2015/03/23 职场文书
老人院义工活动感想
2015/08/07 职场文书
小学安全教育主题班会
2015/08/12 职场文书
导游词之井冈山
2019/11/20 职场文书
Python编写可视化界面的全过程(Python+PyCharm+PyQt)
2021/05/17 Python
windows11选中自动复制怎么开启? Win11自动复制所选内容的方法
2022/07/23 数码科技