2

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);
4

3 回答 3

1

从我看到的问题似乎是:

var ajaxQueue = $({});

ajaxQueue 只是一个空对象,要停止使用你需要将它指向 jQuery 插件的对象

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

,或者只是使用:

$.ajaxQueue.stop( clear );
于 2012-08-25T06:56:32.660 回答
1

我将此功能添加到ajaxQueue代码中。它可能效率不高,但它通过清除队列来完成工作:

if (ajaxOpts=='clear'){
    ajaxQueue.clearQueue();
    return promise;
}
于 2012-09-26T06:43:40.450 回答
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] = [];
    }
}
于 2012-10-09T12:06:35.403 回答