javascript - 链函数次数未知

Question

我正在通过未知数量的步骤为元素的顶部/左侧 css 值设置动画。我正在使用以下代码来存储动画每个步骤所需的 css 值:

paths = [{ left:-300 }, { top:-161 }, { left:-402 }];

然后我可以通过以下方式运行动画:

$element.animate(paths[0]).animate(paths[1]).animate(paths[2]);

这样每个动画都会在前一个动画结束时开始:这样可以正常工作。但是，如果我想将步数从 3(左上左)增加到 6 怎么办？还是50？如何将函数链接到未知次数？

Answer 1

$element.animate(paths.shift(), function next() {
    $(this).animate(paths.shift(), paths.length && next);
});

http://jsfiddle.net/Xsz8w/2/

需要

paths.length && next 来防止无限回调调用。