jQuery ScrollTop：每个动画都需要在跳转到下一个动画之前完成

Question

我正在使用实时搜索插件，使用scrollTop滚动到页面上找到的文字。 代码使用键盘箭头键up和down来选择结果，唯一的问题是由于scrollTop的动画时间，最后的操作结果将无法实现在代码中指定的动画时间之后，尚未实现先前操作的结果。

这意味着如果我连续多次按down键，即使我立即按up，也可以说在页面上找到最后一项后10次key，我必须等到最后10个事件被执行，然后它将执行使用up键的最后一个事件。

$('html,body').animate({scrollTop: mark.offset().top-100}, 100);

Working Fiddle

如果在动画发生的同时按下键，是否有取消上一个事件并跳转到下一个事件？

Answer 1

好的，我现在看到滞后，你需要先用jQuery创建一个队列，然后在搜索改变方向时清除它：

$(element).clearQueue();   

我无法重新创建您描述的滞后效果。但是jquery动画中有一个函数可以用来实现它。

$(element).stop()

我更新了你的jsFiddle，以便在开始新动画之前停止上一个动画here。

另外，您可以详细了解.stop() here。