滚动到顶部后停止向下滚动答案

【问题标题】：Stop scrolling down after scrolling to top滚动到顶部后停止向下滚动
【发布时间】：2018-12-21 18:45:29
【问题描述】：

我的问题是，使用触摸板快速向下滚动后，窗口在 300px 后正确跳到顶部，但在那之后，浏览器仍在向下滚动。

这是我的问题的一个例子 https://codepen.io/anon/pen/XoMExW

我试过了，但是没用

$(window).scroll(function(){
if( $(window).scrollTop() >= 300 ){
   $(window).scrollTop(0);
}
});

【问题讨论】：

当您快速滚动时，窗口会向下滚动300px，然后向上移动到0px。但是卷轴还在。所以滚动处理程序再次被触发。所以如果你的滚动真的又快又短，就不会有这个问题。

标签： javascript jquery html scroll

【解决方案1】：

您可以在每个滚动事件之后添加一个setTimeout。对于每个滚动事件，您将首先清除在上一个事件中创建的事件，然后重新创建一个新事件。这将一直运行，直到您到达最后一个滚动事件，然后在最后一个滚动事件期间，将触发 setTimeout 的回调并运行您的代码：

var isScrolling;

$(window).scroll(function() {
    window.clearTimeout(isScrolling);
    isScrolling = setTimeout(function() {
        if ($(window).scrollTop() >= 300) {
            $(window).scrollTop(0);
        }
    }, 100);
});

【讨论】：

谢谢，我以前试过这个，但问题仍然存在，因为有时浏览器滚动持续时间超过 2 秒，如果我将计时器增加 > 2 秒，这将是一个用户无法再次滚动的时间过长。
我不确定我理解你所说的 2 秒是什么意思？
对我来说重要的是用户可以在他最后一次滚动之后直接滚动。在您的代码中，计时器有 100 毫秒，但如果用户滚动得足够快，则释放触摸板后滚动可能需要大约 2 秒才能停止。这意味着，我需要将计时器设置为超过 2 秒，但是在这 2 秒内，用户无法进行新的滚动交互。