jQuery, Dequeue un ajaxQueue

Question

Sto usando l'ajaxQueue citato nell'esempio Queueing something like Ajax Calls:

// jQuery on an empty object, we are going to use this as our queue 
var ajaxQueue = $({}); 
$.ajaxQueue = function(ajaxOpts) { 
    // Hold the original complete function. 
    var oldComplete = ajaxOpts.complete; 
    // Queue our ajax request. 
    ajaxQueue.queue(function(next) { 
     // Create a complete callback to fire the next event in the queue. 
     ajaxOpts.complete = function() { 
      // Fire the original complete if it was there. 
      if (oldComplete) { 
       oldComplete.apply(this, arguments); 
      } 
      // Run the next query in the queue. 
      next(); 
     }; 
     // Run the query. 
     $.ajax(ajaxOpts); 
    }); 
}; 

Ho anche una funzione per rendere l'Ajax di chiamata e aggiungere il risultato a un div (semplificato):

function ajaxCall() { 
    $.ajaxQueue({ 
     type: "POST", 
     url: myURL, 
     async: true, 
     cache: false, 
     success: function(result) { 
      $('#divID').append($('<div/>').html($(result).html()).fadeIn(200)); 
     } 
    }); 
} 

Poi su un loop di eventi click io attraverso la chiamata AJAX (semplificato):

$("#btn").on("click", function() { 
    // (???) Dequeue the ajaxQueue 
    $('#divID').html(''); // Clear current results 
    for(var i=0; i<15; i++) { 
     ajaxCall(); 
    } 
}); 

The Problem
Se un utente fa clic sul collegamento mentre la coda è ancora in esecuzione, viene aggiunta una nuova coda di chiamate Ajax, con conseguente risultato maggiore del previsto. Ho bisogno di cancellare la coda al clic, prima che inizi un nuovo ciclo.

Qui è un jsFiddle Demo. Qualsiasi raccomandazione molto apprezzata.

Answer 1

Uso clearQueue:

ajaxQueue.clearQueue(); 

EDIT

Il problema è che ci potrebbe essere ancora una richiesta AJAX essere chiamato.

Così si potrebbe desiderare di tenere traccia della richiesta corrente:

currentRequest = $.ajax(ajaxOpts); 

E interrompere questo quando si elimina la coda:

if (currentRequest) { 
    currentRequest.abort(); 
} 

Vedere http://jsfiddle.net/4AQ9N/6/

Answer 2

È necessario

ajaxQueue.queue("fx", []); // fx is defualt queue Name. 

Vedi DEMO

success: function(result) { 
      if(num!=0){ 
       $('#divID').append($('<div/>').html('Result '+num).fadeIn(300)); 
      } 
      num++; 
     } 

$("#btn").on("click", function(e) { 
    e.preventDefault(); 
    if(ajaxQueue.queue().length>0){ 
     num = 0; 
     ajaxQueue.queue("fx", []); 
    }else{ 
     num = 1; 
    } 
    $('#divID').html(''); // Clear current results 



    for(var i=0; i<40; i++) { 
     ajaxCall(); 
    } 

}); 

Qui si potrebbe vedere 1 uscita in più ... cioè. fino a 41. ma non è perché la coda non funziona ... quando si è Clear the queue c'è già una chiamata ajax ... e in attesa di risposta. la risposta viene ricevuta dopo che la coda è stata completata.

Ho aggiunto il codice aggiornato con qualche modifica num valore. funzionerà la maggior parte delle volte.