jquery - 关于 jquery 自定义队列的出队的困惑

Question

首先我有一个工厂函数来改变背景颜色，该函数正在推送一个自定义队列：

var changeBack = function (delay, color) {
    $('div').queue('custom', function (next) {
        setTimeout(function () {
            $('div').css({
                'background-color': color
            })
        }, delay)   
    })    
}

然后我想多次更改背景颜色，然后dequeue是队列：

$(function () {
    changeBack(1000, "yellow");
    changeBack(1000, "black");
    changeBack(1000, "blue");
    changeBack(1000, "gray");
    var custom = $('div').queue('custom');
    $('div').dequeue('custom');
})

但是div只是变成黄色背景色，这意味着只执行第一个功能？但是我已经将另一个功能推入队列，我该如何执行另一个功能？这是演示

Answer 1

延迟的正确方法不是setTimeout，而是$.fn.delay：http: //jsfiddle.net/uVjQ4/8/

var changeBack = function (delay, color) {
    var $div = $('div'); //<-- Cached selector, so that the selected element(s) 
                         // are same throughout the whole function.
    $div.delay(delay, 'custom').queue('custom', function (next) {
        ....
        next(); // Trigger next
    });
};

....
// Initialize 
    $('div').dequeue('custom');