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 相关文章推荐
Code:loadScript( )加载js的功能函数
Feb 02 Javascript
使用Firebug对js进行断点调试的图文方法
Apr 02 Javascript
JS自调用匿名函数具体实现
Feb 11 Javascript
jQuery中outerWidth()方法用法实例
Jan 19 Javascript
getElementById().innerHTML与getElementById().value的区别
Oct 27 Javascript
node.js缺少mysql模块运行报错的解决方法
Nov 13 Javascript
js 颜色选择插件
Jan 23 Javascript
ES6中class类用法实例浅析
Apr 06 Javascript
原生js jquery ajax请求以及jsonp的调用方法
Aug 04 jQuery
jquery插件开发之选项卡制作详解
Aug 30 jQuery
详解微信小程序网络请求接口封装实例
May 02 Javascript
Vue组件化(ref,props, mixin,.插件)详解
May 15 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中输出转义JavaScript代码的实现代码
2011/04/22 PHP
php中strlen和mb_strlen用法实例分析
2016/11/12 PHP
表单的一些基本用法与技巧
2006/07/15 Javascript
javascript+dom树型菜单类,希望朋友们一起进步
2007/05/03 Javascript
js注意img图片的onerror事件的分析
2011/01/01 Javascript
原生js实现给指定元素的后面追加内容
2013/04/10 Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
2014/01/15 Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
2015/03/23 Javascript
JavaScript中setTimeout和setInterval函数的传参及调用
2016/03/11 Javascript
jQuery学习笔记之入门
2016/12/14 Javascript
js图片延迟加载(Lazyload)三种实现方式
2017/03/01 Javascript
高性能的javascript之加载顺序与执行原理篇
2018/01/14 Javascript
详解如何用babel转换es6的class语法
2018/04/03 Javascript
4 种滚动吸顶实现方式的比较
2019/04/09 Javascript
JS用最简单的方法实现四舍五入
2019/08/27 Javascript
在layui框架中select下拉框监听更改事件的例子
2019/09/20 Javascript
Jquery+javascript实现支付网页数字键盘
2020/12/21 jQuery
[33:15]2018DOTA2亚洲邀请赛3月30日 小组赛B组 VP VS Mineski
2018/03/31 DOTA
对pandas中apply函数的用法详解
2018/04/10 Python
Django安装配置mysql的方法步骤
2018/10/15 Python
python实现读取excel文件中所有sheet操作示例
2019/08/09 Python
Python zip函数打包元素实例解析
2019/12/11 Python
详解pyinstaller生成exe的闪退问题解决方案
2020/06/19 Python
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
伯利陶器:Burleigh Pottery
2018/01/03 全球购物
前台文员个人求职信范文
2014/01/05 职场文书
小学一年级学生评语
2014/04/22 职场文书
五一口号
2014/06/19 职场文书
教师党的群众路线对照检查材料
2014/09/24 职场文书
2015年党性分析材料
2014/12/19 职场文书
优秀小学生事迹材料
2014/12/26 职场文书
教师个人年度总结
2015/02/11 职场文书
小学班主任工作随笔
2015/08/15 职场文书
2016领导干部廉洁自律心得体会
2016/01/13 职场文书
演讲稿之我的初心我的成长
2019/08/12 职场文书
JavaScript流程控制(分支)
2021/12/06 Javascript