jQuery「隊列」（ajaxQueue插件） - 如何清除？

Question

Corey Frang在stackoverflow上發佈了一個有用的插件，用於排隊ajax請求。就我而言，用「大塊」加載大量數據是非常有用的，以減少用戶感知的慢度。除非在ajax請求的隊列完成之前觸發分頁事件，否則這種情況完美地起作用，在這種情況下，持有加載對象的容器將清除，但排隊的請求將繼續運行，從而導致不希望的行爲。我想要的是找到/學習清除所有現有請求隊列的方法。開發人員發佈了一種方法來執行此操作，但它似乎不起作用。我試着在jQuery網站上閱讀.queue，但我似乎無法理解如何使這項工作。我已經花了很多時間來解決這個問題，但也許我對jQuery的一些更復雜的方面的熟悉程度讓我難以接受。希望有人在那裏誰更熟悉的jQuery能幫助:)（標記什麼建議並沒有出現一些工作「!!!!!」）

/* 
* jQuery.ajaxQueue - A queue for ajax requests 
* 
* (c) 2011 Corey Frang 
* Dual licensed under the MIT and GPL licenses. 
* 
* Requires jQuery 1.5+ 
*/ 
(function($) { 

// jQuery on an empty object, we are going to use this as our Queue 
var ajaxQueue = $({}); 

$.ajaxQueue = function(ajaxOpts) { 
    var jqXHR, 
     dfd = $.Deferred(), 
     promise = dfd.promise(); 

    // queue our ajax request 
    ajaxQueue.queue(doRequest); 

    // add the abort method 
    promise.abort = function(statusText) { 

     // proxy abort to the jqXHR if it is active 
     if (jqXHR) { 
      return jqXHR.abort(statusText); 
     } 

     // if there wasn't already a jqXHR we need to remove from queue 
     var queue = ajaxQueue.queue(), 
      index = $.inArray(doRequest, queue); 

     if (index > -1) { 
      queue.splice(index, 1); 
     } 

     // and then reject the deferred 
     dfd.rejectWith(ajaxOpts.context || ajaxOpts, 
      [ promise, statusText, "" ]); 

     return promise; 
    }; 

    // run the actual query 
    function doRequest(next) {   
     jqXHR = $.ajax(ajaxOpts) 
      .then(next, next) 
      .done(dfd.resolve) 
      .fail(dfd.reject); 
    } 

    return promise; 
}; 

// !!!!!!!!!!!!!!!!! 
// this is what the developer suggested on his website in the comments section 
// ... but it does not appear to work 
$.ajaxQueue.stop = function(clear) { ajaxQueue.stop(clear); } 

})(jQuery); 

Answer 1

感謝您爲幫助我解決問題所做的努力。然而..

我發現了一個更好的ajax隊列插件 - Oleg Podolsky的「ajaxq」，如果你需要排隊ajax請求（以及正確清除隊列的能力），我推薦使用它。

添加到隊列：

ajaxq('queue_name', { 
    // standard $.ajax options 
}); 

停止/清除隊列：

ajaxq('queue_name'); 

插件：

/* 
* jQuery AjaxQ - AJAX request queueing for jQuery 
* 
* Version: 0.0.1 
* Date: July 22, 2008 
* 
* Copyright (c) 2008 Oleg Podolsky (oleg.podolsky@gmail.com) 
* Licensed under the MIT (MIT-LICENSE.txt) license. 
* 
* http://plugins.jquery.com/project/ajaxq 
* http://code.google.com/p/jquery-ajaxq/ 
*/ 

jQuery.ajaxq = function (queue, options) 
{ 
    // Initialize storage for request queues if it's not initialized yet 
    if (typeof document.ajaxq == "undefined") document.ajaxq = {q:{}, r:null}; 

    // Initialize current queue if it's not initialized yet 
    if (typeof document.ajaxq.q[queue] == "undefined") document.ajaxq.q[queue] = []; 

    if (typeof options != "undefined") // Request settings are given, enqueue the new request 
    { 
     // Copy the original options, because options.complete is going to be overridden 

     var optionsCopy = {}; 
     for (var o in options) optionsCopy[o] = options[o]; 
     options = optionsCopy; 

     // Override the original callback 

     var originalCompleteCallback = options.complete; 

     options.complete = function (request, status) 
     { 
      // Dequeue the current request 
      document.ajaxq.q[queue].shift(); 
      document.ajaxq.r = null; 

      // Run the original callback 
      if (originalCompleteCallback) originalCompleteCallback (request, status); 

      // Run the next request from the queue 
      if (document.ajaxq.q[queue].length > 0) document.ajaxq.r = jQuery.ajax (document.ajaxq.q[queue][0]); 
     }; 

     // Enqueue the request 
     document.ajaxq.q[queue].push (options); 

     // Also, if no request is currently running, start it 
     if (document.ajaxq.q[queue].length == 1) document.ajaxq.r = jQuery.ajax (options); 
    } 
    else // No request settings are given, stop current request and clear the queue 
    { 
     if (document.ajaxq.r) 
     { 
      document.ajaxq.r.abort(); 
      document.ajaxq.r = null; 
     } 

     document.ajaxq.q[queue] = []; 
    } 
} 

在這種情況下

Answer 2

從我所看到的問題似乎是：

var ajaxQueue = $({}); 

ajaxQueue只是一個空的對象，停止使用，你需要把它指向的jQuery插件

ajaxQueue.stop = function(clear) { $.ajaxQueue.stop(clear); } 

，或者只是對象使用：

$.ajaxQueue.stop(clear); 

Answer 3

我在ajaxQueue代碼中增加了這個函數。這可能不是有效的，但它通過清除隊列來完成工作：

if (ajaxOpts=='clear'){ 
    ajaxQueue.clearQueue(); 
    return promise; 
}