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);
答案 0 :(得分:1)
var ajaxQueue = $({});
ajaxQueue只是一个空对象,要停止使用你需要指向jQuery插件的对象
ajaxQueue.stop = function( clear ) { $.ajaxQueue.stop( clear ); }
,或者只是使用:
$.ajaxQueue.stop( clear );
答案 1 :(得分:1)
我将此函数添加到ajaxQueue
代码中。它可能效率不高,但它通过清除队列来完成工作:
if (ajaxOpts=='clear'){
ajaxQueue.clearQueue();
return promise;
}
答案 2 :(得分: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] = [];
}
}