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 相关文章推荐
Prototype的Class.create函数解析
Sep 22 Javascript
jquery使用jquery.zclip插件复制对象的实例教程
Dec 04 Javascript
jQuery中:image选择器用法实例
Jan 03 Javascript
JQuery显示、隐藏div的几种方法简明总结
Apr 16 Javascript
js实现的Easy Tabs选项卡用法实例
Sep 06 Javascript
jQuery formValidator表单验证
Jan 07 Javascript
vue从使用到源码实现教程详解
Sep 19 Javascript
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 jQuery
JavaScript对象_动力节点Java学院整理
Jun 23 Javascript
Windows下Node.js安装及环境配置方法
Sep 18 Javascript
基于react后端渲染模板引擎noox发布使用
Jan 11 Javascript
微信小程序wx.uploadfile 本地文件转base64的实现代码
Jun 28 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中全局变量global的使用演示代码
2011/05/18 PHP
php函数传值的引用传递注意事项分析
2016/06/25 PHP
PHP实现超简单的SSL加密解密、验证及签名的方法示例
2017/08/28 PHP
PHP实现二叉树深度优先遍历(前序、中序、后序)和广度优先遍历(层次)实例详解
2018/04/20 PHP
javascript让setInteval里的函数参数中的this指向特定的对象
2010/01/31 Javascript
悄悄用脚本检查你访问过哪些网站的代码
2010/12/04 Javascript
基于jquery的分页控件(C#)
2011/01/06 Javascript
js修改table中Td的值(定义td的单击事件)
2013/01/10 Javascript
使用js完成节点的增删改复制等的操作
2014/01/02 Javascript
js jquery ajax的几种用法总结(及优缺点介绍)
2014/01/28 Javascript
Webpack 实现 AngularJS 的延迟加载
2016/03/02 Javascript
详细分析Javascript中创建对象的四种方式
2016/08/17 Javascript
React 组件渲染和更新的实现代码示例
2019/02/21 Javascript
如何优雅地在vue中添加权限控制示例详解
2019/03/07 Javascript
Vue组件通信中非父子组件传值知识点总结
2019/12/05 Javascript
如何利用 JS 脚本实现网页全自动秒杀抢购功能
2020/10/12 Javascript
通过5个知识点轻松搞定Python的作用域
2016/09/09 Python
分享给Python新手们的几道简单练习题
2017/09/21 Python
python读写配置文件操作示例
2019/07/03 Python
将pytorch转成longtensor的简单方法
2020/02/18 Python
mac 上配置Pycharm连接远程服务器并实现使用远程服务器Python解释器的方法
2020/03/19 Python
TensorFlow2.0使用keras训练模型的实现
2021/02/20 Python
利用简洁的图片预加载组件提升html5移动页面的用户体验
2016/03/11 HTML / CSS
介绍一下Make? 为什么使用make
2016/07/31 面试题
法警的竞聘演讲稿
2014/01/02 职场文书
小学教师师德反思
2014/02/03 职场文书
班子四风对照检查材料思想汇报
2014/09/29 职场文书
2014年六五普法工作总结
2014/11/25 职场文书
法人代表资格证明书
2015/06/18 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
婚宴来宾致辞
2015/07/28 职场文书
《中彩那天》教学反思
2016/02/24 职场文书
SQL Server2019数据库之简单子查询的具有方法
2021/04/27 SQL Server
关于nginx 实现jira反向代理的问题
2021/09/25 Servers
Java的Object类的九种方法
2022/04/13 Java/Android
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript