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 相关文章推荐
JQuery 浮动导航栏实现代码
Aug 27 Javascript
Javascript new关键字的玄机 以及其它
Aug 25 Javascript
通过js来制作复选框的全选和不选效果
May 22 Javascript
获取中文字符串的实际长度代码
Jun 05 Javascript
Bootstrap table分页问题汇总
May 30 Javascript
jQuery实现获取元素索引值index的方法
Sep 18 Javascript
vue高德地图之玩转周边
Jun 16 Javascript
angularjs实现天气预报功能
Jun 16 Javascript
实例讲解JavaScript预编译流程
Jan 24 Javascript
JavaScript遍历数组的三种方法map、forEach与filter实例详解
Feb 27 Javascript
用Golang运行JavaScript的实现示例
Nov 25 Javascript
TS 类型收窄教程示例详解
Sep 23 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使用PHPMailer发送邮件的简单使用方法
2013/11/12 PHP
使用php伪造referer的方法 利用referer防止图片盗链
2014/01/20 PHP
js 获取和设置css3 属性值的实现方法
2013/05/06 Javascript
转换字符串为json对象的方法详解
2013/11/29 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/07/18 Javascript
jquery实现手风琴效果
2015/11/20 Javascript
JavaScript学习笔记整理_用于模式匹配的String方法
2016/09/19 Javascript
Vue2.0 事件的广播与接收(观察者模式)
2018/03/14 Javascript
react实现换肤功能的示例代码
2018/08/14 Javascript
vue设计一个倒计时秒杀的组件详解
2019/04/06 Javascript
[01:54]TI4西雅图DOTA2选手欢迎晚宴 现场报道
2014/07/08 DOTA
python中合并两个文本文件并按照姓名首字母排序的例子
2014/04/25 Python
使用Pyrex来扩展和加速Python程序的教程
2015/04/13 Python
python使用urlparse分析网址中域名的方法
2015/04/15 Python
python实现将内容分行输出
2015/11/05 Python
Python文件操作基本流程代码实例
2017/12/11 Python
对python创建及引用动态变量名的示例讲解
2018/11/10 Python
Python3实现腾讯云OCR识别
2018/11/27 Python
python判断计算机是否有网络连接的实例
2018/12/15 Python
解决Python正则表达式匹配反斜杠''\''问题
2019/07/17 Python
在Python中等距取出一个数组其中n个数的实现方式
2019/11/27 Python
Python3使用腾讯云文字识别(腾讯OCR)提取图片中的文字内容实例详解
2020/02/18 Python
Python3使用tesserocr识别字母数字验证码的实现
2021/01/29 Python
总裁岗位职责
2013/12/04 职场文书
酒店led欢迎词
2014/01/09 职场文书
租房协议书怎么写
2014/04/10 职场文书
《鸿门宴》教学反思
2014/04/22 职场文书
党的群众路线教育实践活动个人承诺书
2014/05/22 职场文书
移交协议书
2014/08/19 职场文书
会员活动策划方案
2014/08/19 职场文书
大学生助学金感谢信
2015/01/21 职场文书
销售会议开幕词
2015/01/28 职场文书
矛盾论读书笔记
2015/06/29 职场文书
python实现自动化群控的步骤
2021/04/11 Python
Oracle更换为MySQL遇到的问题及解决
2021/05/21 Oracle
Pytorch 如何实现常用正则化
2021/05/27 Python