[javascript]AJAX Queue/Synch/Abort/Block Manager

这个js库可以实现对ajax调用的管理,例如ajax队列,中断调用,阻塞调用等等。
首先来看下示范代码:

var ajaxManager1 = $.manageAjax({manageType: 'abortOld', maxReq: 0});
ajaxManager1.add({
  success: function(html) {
    $('ul').append('
  • '+html+'
  • '); }, url: 'test.html' });
    要使用这个js,首先你要调用$.manageAjax这个方法(先在header包含js文件就不用说了吧)。这个方法接受以下的参数:

    • jQuery Ajax的参数,详情点击这里
    • manageType:(string):指定ajax队列的行为。它可以接受如下几个值:
      • 'sync':这个参数表示ajax的response顺序将会跟request时的顺序一样。
      • 'queue':这个参数表示ajax的request将会排成队列顺序执行。就是说第二个请求的response会在第一个请求的response之后。要使用这个参数必须指定maxReq。
      • 'abortOld':如果有一个较新的request的response,则旧的就会被中断掉。
      • 'normal':普通的ajax行为。
    • maxReq:(number):这个参数用来限制队列里ajax请求的处理个数。如果你的manageType不是设为'queue',那么较早的请求将会被终止。(默认值为0,表示不限制队列的请求个数。)
    • blockSameRequest:(boolean):如果为true,则相同的请求将不会被执行。默认为false。

    在创建了$.ajaxManager对象后,有两个方法供调用:

    • $.ajaxManager.prototype.add:(options):用这个方法可以添加一个ajax请求。方法将返回请求的索引值。options为以下值:
      • 普通的jQuery Ajax Options。详情点击这里
      • 'abort': ([function]):请求被终止时,将会调用指定的方法。
    • $.ajaxManager.prototype.abort: ([number]):用来终止队列里的ajax请求。如果指定索引值的话,则只会终止该索引对应的请求。

    Demo可以到官网进行查看。如果你使用FF的话,还可以用firebug进行追踪,看看每种manageType具体是怎么运作的。下面是我就网站里的demo的一些测试结果:
    {manageType: 'sync', maxReq: 0}
    各个请求将会按照请求顺序进行返回。假如先后有两个请求:3 secounds delay和2 secounds delay。虽然2 secounds delay的回应回比3 secounds delay要快,但是首先调用callback的会是3 secounds delay。
    {manageType: 'abortOld', maxReq: 0}
    照上面的解释,如果后面的请求的回应比先前的早,那么先前的请求将被abort。而且maxReq为0,所以这里的Demo貌似看不出什么效果……
    {maxReq: 2}
    同时只能对两个请求进行管理。较早的请求将会被终止。例如前后调用了2 secounds delay,3 secounds delay,2 secounds delay,则回应的会是3 secounds delay及后面那个2 secounds delay,第一个2 secounds delay将不会执行到callback。
    {manageType: 'abortOld', maxReq: 2, blockSameRequest: true}
    这个demo的结果有点莫名其妙。举个例子。假如先后调用了3 secounds delay,2 secounds delay和1 secound delay,有时3 secounds delay和2 secounds delay会被abort,有时只有3 secounds delay被abort。其他的情况也会出现不同的结果,有待测试= =
    {manageType: 'queue', maxReq: 2, blockSameRequest: true}
    这个也有点问题。假如调用顺序为2,2,2,则只会执行一个2,这个没什么问题。但是假如调用顺序为3,2,3,有时则以2,3的顺序回调,有时则以3,2的顺序回调。搞不懂= =

    大概我还没搞清楚blockSameRequest的效果吧,毕竟block跟abort是不同的。

    详情内容及下载请到官网:
    http://www.protofunc.com/scripts/jquery/ajaxManager/

    此条目发表在 网站前端 分类目录,贴了 , , , 标签。将固定链接加入收藏夹。

    发表评论