javascript - 为 jQuery 动画设置队列长度

Question

有没有办法设置动画函数的队列长度？

想象一下有人使用箭头键触发了一个 jQuery 动画函数。现在他疯狂地冲箭头键，不得不等待排队的功能完成，这可能需要很多时间，而且可能会令人困惑和伤脑筋。我知道你可以 stop() 一个动画，但我希望它的队列长度只有三个。

这是一个小提琴。打开它并敲击你的钥匙。

示例代码：

var div = $(".bouncer");

function runIt() {
div
    .animate({ left: "+=200" }, 500 )
    .animate({ left: "-=200" }, 500 )
}

$(document).keydown(function(e) {
    if (e.keyCode) {
        runIt();
    }
});

Answer 1

据我所知，没有直接的方法可以做到这一点，但试试这个：

var div = $(".bouncer");

function runIt() {
div.animate({left: "+=200" }, 500)
   .animate({left: "-=200" }, 500)
}

$(document).keydown(function (e) {
if (e.keyCode) {
    var len=div.queue("fx").length;
    if(len<=1)
      runIt();
    }
});

jsfiddle.net/kcCG5/4/