Question

我正在实现各种信息的队列系统。当它达到一定数量时，我发送一个ajax请求....用户输入数据，当它到达我发送的某个点时。但是，用户仍然可以输入数据。我不想失去那个..所以，我想我可以使用$.Deferred/promise，同时将数据存储到某个点...解雇ajax，并且只允许新的请求，当前一个延迟是成功...同样，如果输入的数据然后增加到我必须再次发送的点，我就把它弄错..

我很难将我的大脑围绕着如何实施的方法。

===＆GT;捕获数据

=======＆GT;输入'n'数据量

=============＆GT;将该数据移动到“准备好”的桶中。（任意，让用户输入10个输入字段，然后存储到数组中。当数组达到10时，繁荣发送它。）

=============＆GT;用10个项目点燃ajax

与此同时，用户仍然可以输入数据。我想确保我仍然捕获它并继续排队并在10点发送。

我在想一个延迟的排队系统。不确定我是不是在想这个。

Answer 1

由于$.ajax()返回的jqXHR对象是Promise，因此可以使用。

var data = {
    // captured data goes here
};

function sendData( val ){
    // jqXHR object (which contains a promise)
    return $.ajax('/foo/', {
        data: { value: val },
        dataType: 'json',
        success: function( resp ){
            // do whatever needed
        }
    });
}

function when(){
    $.when(sendData(data)).done(function (resp) {
        when();
    });
}

when(); // use this within the if switch

DEMO

Answer 2

假设您的队列是数组dataQueue，那么您可以执行以下操作：

var dataQueue = [];//sacrificial queue of items to be sent in batches via AJAX request
var batchSize = 10;
var requesting = false;//flag used to suppress further requests while a request is still being serviced

//addToQueue: a function called whenever an item is to be added to he queue.
function addToQueue(item) {
    dataQueue.push(item);
    send();//(conditional on queue length and no request currently being serviced)
}

function send() {
    if(dataQueue.length >= batchSize && !requesting) {//is the queue long enough for a batch to be sent, and is no ajax request being serviced
        $.ajax({
            url: '/path/to/server/side/script',
            data: JSON.stringify(dataQueue.splice(0, batchSize)),//.splice removes items from the queue (fifo)
            ... //further ajax options
        }).done(handleResponse).fail(handleFailure).always(resetSend);
        requesting = true;
    }
}

function handleResponse(data, textStatus, jqXHR) {
    //handle the server's response data here
}
function handleFailure(jqXHR, textStatus, errorThrown) {
    //handle failure here
}
function resetSend() {
    requesting = false;//Lower the flag, to allow another batch to go whenever the queue is long enough.
    send();//Call send again here in case the queue is already long enough for another batch.
}

<强> DEMO

注意：

没有特别的理由从send返回jqXHR（或其他任何内容），但如果您的应用程序受益，请务必这样做。
resetSend不一定需要被称为.always处理程序。从.done处理程序（而不是.error处理程序）调用会产生“因故障而死”的效果。
为了最小化命名空间中的成员数（全局或其他），您可以选择将整个事物封装在构造函数或单例命名空间模式中，这两者都非常简单。
封装在构造函数中，允许您拥有两个或多个具有所需行为的队列，每个队列都有自己的设置。
该演示有一些额外的代码行，可以使过程可观察到。
在演示中，您可以将batchsize设置为15，add-add-add将队列长度设置为12，然后将batchsize减少为5并添加另一个项目。您应该看到两个连续请求，以及队列中的3个剩余项目。

延迟和ajax和排队功能

2 个答案: