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 相关文章推荐
Flash+XML滚动新闻代码 无图片 附源码下载
Nov 22 Javascript
javaScript call 函数的用法说明
Apr 09 Javascript
javascript 设计模式之单体模式 面向对象学习基础
Apr 18 Javascript
jQuery 事件的命名空间简单了解
Nov 22 Javascript
解决wx.onMenuShareTimeline出现的问题
Aug 16 Javascript
浅谈angularjs $http提交数据探索
Jan 20 Javascript
canvas绘制一个常用的emoji表情
Mar 30 Javascript
JavaScript阻止表单提交方法(附代码)
Aug 15 Javascript
如何用JavaScript实现功能齐全的单链表详解
Feb 11 Javascript
深入了解query和params的使用区别
Jun 24 Javascript
JS常见错误(Error)及处理方案详解
Jul 02 Javascript
如何在VUE中使用vue-awesome-swiper
Jan 04 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面向对象全攻略 (八)重载新的方法
2009/09/30 PHP
PHP函数实现分页含文本分页和数字分页
2014/10/23 PHP
PHP的伪随机数与真随机数详解
2015/05/27 PHP
PHP实现的简单分页类及用法示例
2016/05/06 PHP
js鼠标左右键 键盘值小结
2010/06/11 Javascript
js操作二级联动实现代码
2010/07/27 Javascript
javascript使用eval或者new Function进行语法检查
2010/10/16 Javascript
js 调用父窗口的具体实现代码
2013/07/15 Javascript
jQuery选择器源码解读(八):addCombinator函数
2015/03/31 Javascript
举例说明JavaScript中的实例对象与原型对象
2016/03/11 Javascript
Node.js连接MongoDB数据库产生的问题
2017/02/08 Javascript
JS 调试中常见的报错问题解决方法
2017/05/20 Javascript
详解Angular2 关于*ngFor 嵌套循环
2017/05/22 Javascript
AngularJs+Bootstrap实现漂亮的计算器
2017/08/10 Javascript
jQuery DOM节点的遍历方法小结
2017/08/15 jQuery
nodejs中安装ghost出错的原因及解决方法
2017/10/23 NodeJs
解决node-sass偶尔安装失败的方法小结
2018/12/05 Javascript
Vue scrollBehavior 滚动行为实现后退页面显示在上次浏览的位置
2019/05/27 Javascript
在vue中实现清除echarts上次保留的数据(亲测有效)
2020/09/09 Javascript
[03:24]2014DOTA2国际邀请赛 神秘商店生意火爆
2014/07/18 DOTA
python实现同一局域网下传输图片
2020/03/20 Python
opencv 图像加法与图像融合的实现代码
2020/07/08 Python
详解Python 函数参数的拆解
2020/09/02 Python
美国最古老的精致书写工具制造商:A.T. Cross(高仕)
2018/01/30 全球购物
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
Abbacino官网:包、钱包和女士配饰
2019/04/15 全球购物
后勤人员岗位职责
2013/12/17 职场文书
同事打架检讨书
2014/02/04 职场文书
竞选村长演讲稿
2014/04/28 职场文书
员工年终自我评价
2014/09/14 职场文书
2015年春节标语口号
2014/12/09 职场文书
2014年小学数学工作总结
2014/12/12 职场文书
超级实用!五步法则,教你写好年终工作总结
2019/12/05 职场文书
python如何读取.mtx文件
2021/04/22 Python
OpenCV全景图像拼接的实现示例
2021/06/05 Python
彻底卸载VMware虚拟机的超详细步骤记录
2022/07/15 Servers