使用jQuery.queue排队Ajax请求（） [英] Queue ajax requests using jQuery.queue()

问题描述

我使用jQuery.queue（）的第一次并没有完全掌握它。 可能有人请指出什么即时做错了什么？

I am using jQuery.queue() for the first time and haven't quite grasped it. Could someone please point out what im doing wrong?

在看萤火，我仍然看到射击的同时我POST请求 - 所以我想知道如果我打电话出列（）在错误的地方

Looking in firebug I am still seeing my POST requests firing at the same time - so I'm wondering if I'm calling dequeue() in the wrong place.

此外 - 我怎样才能得到队列长度？谢谢！

Also - how can I get the queue length? Thanks!

我需要排队这些请求的原因是，它得到射击在点击一个按钮。而其可能为用户点击快速连续多个按钮。

The reason I need to queue these requests is that it gets fired on click of a button. And its possible for the user to click multiple buttons in quick succession.

试图剥夺了我的code的基本结构：

Tried to strip out the basic structure of my code:

$("a.button").click(function(){
   $(this).doAjax(params);
});

// method
doAjax:function(params){ 

   $(document).queue("myQueueName", function(){
     $.ajax({
       type: 'POST',
       url: 'whatever.html',
       params: params,
       success: function(data){
         doStuff;

         $(document).dequeue("myQueueName");
       }
     });
   });

}

在此先感谢您的帮助。

Thanks in advance for any help.

推荐答案

您这里的问题是，该阿贾克斯（）触发一个asyncronous运行Ajax请求。这意味着，阿贾克斯（）立即返回，不堵塞。所以，你的队列中的功能，但他们几乎火在同一时间像你描述的。

You problem here is, that .ajax() fires an asyncronous running Ajax request. That means, .ajax() returns immediately, non-blocking. So your queue the functions but they will fire almost at the same time like you described.

我不认为 .queue（）是一个好地方，在Ajax请求，它更适用于使用的FX方法。你需要一个简单的管理。

I don't think the .queue() is a good place to have ajax requests in, it's more intended for the use of fx methods. You need a simple manager.

var ajaxManager = (function() {
     var requests = [];

     return {
        addReq:  function(opt) {
            requests.push(opt);
        },
        removeReq:  function(opt) {
            if( $.inArray(opt, requests) > -1 )
                requests.splice($.inArray(opt, requests), 1);
        },
        run: function() {
            var self = this,
                oriSuc;

            if( requests.length ) {
                oriSuc = requests[0].complete;

                requests[0].complete = function() {
                     if( typeof(oriSuc) === 'function' ) oriSuc();
                     requests.shift();
                     self.run.apply(self, []);
                };   

                $.ajax(requests[0]);
            } else {
              self.tid = setTimeout(function() {
                 self.run.apply(self, []);
              }, 1000);
            }
        },
        stop:  function() {
            requests = [];
            clearTimeout(this.tid);
        }
     };
}());

这是被完美的远，我只是想证明的路要走。上面的例子中可以使用在某种程度上像

This is far away from being perfect, I just want to demonstrate the way to go. The above example could be used in a way like

$(function() {
    ajaxManager.run(); 

    $("a.button").click(function(){
       ajaxManager.addReq({
           type: 'POST',
           url: 'whatever.html',
           data: params,
           success: function(data){
              // do stuff
           }
       });
    });
});

这篇关于使用jQuery.queue排队Ajax请求（）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！