Javascript 使用jQuery时，防止滚动过快

为了防止鼠标滚轮在使用自己的滚动条到达元素的顶部/底部时滚动整个页面，我使用了Brandon Aaron的

只要我滚动得不太快，这个就可以了。看起来，当快速滚动时，两个事件将通过“我还没有到达顶部/底部”检查，并且都将被执行。但是，其中一个会将元素滚动到上/下，下一个会滚动整个页面，这正是我试图阻止的

我现在正在做这个

$('.popupContents').bind('mousewheel', function (e, d) {
    var t = $(this);
    if (d > 0 && t.scrollTop() === 0) {
        e.preventDefault();
    } else if (d < 0 && (t.scrollTop() == t.get(0).scrollHeight - t.innerHeight())) {
         e.preventDefault();
    }
});

$（'.popupContents'）.bind（'mouseweel'，函数（e，d）{
var t=$（本）；
如果（d>0&&t.scrollTop（）==0）{
e、 预防默认值（）；
}否则如果（d<0&（t.scrollTop（）==t.get（0.scrollHeight-t.innerHeight（）））{
e、 预防默认值（）；
}
});

（如发布于）

---

如何使该功能在用户快速滚动时正确停止顶部/底部的所有事件？

我最终手动跟踪所需的滚动位置，并完全禁止正常滚动事件

var wantedScrollTop = 0;
$('.popupBody').bind('mousewheel', function (e, d) {
    var t = $(this);
    var scrollTo;
    if (d > 0) {
        scrollTo = Math.max(0, wantedScrollTop - 30);
    } else if (d < 0) {
        scrollTo = Math.min(t.get(0).scrollHeight - t.innerHeight(), wantedScrollTop + 30);
    }
    if (typeof scrollTo !== "undefined") {
        wantedScrollTop = scrollTo;
        t.scrollTop(wantedScrollTop);
        //t.stop().animate({ scrollTop: wantedScrollTop + 'px' }, 150);
    }
    e.preventDefault();
});

var wantedScrollTop=0；
$（'.popubody'）.bind（'mousewheel'，函数（e，d）{
var t=$（本）；
var-scrollTo；
如果（d>0）{
scrollTo=Math.max（0，wantedScrollTop-30）；
}else如果（d<0）{
scrollTo=Math.min（t.get（0.scrollHeight-t.innerHeight（），wantedScrollTop+30）；
}
如果（滚动条的类型！=“未定义”）{
wantedScrollTop=scrollTo；
t、 scrollTop（wantedScrollTop）；
//t、 stop（）.animate（{scrollTop:wantedScrollTop+'px'}，150）；
}
e、 预防默认值（）；
});

d

是滚动方向，所以我在这里手动跟踪想要的滚动位置。在我的例子中，一次只有一个弹出窗口，因此我没有费心将

wantedScrollTop

粘贴在元素的

数据-

属性或类似属性中，这在有多个元素需要跟踪它们自己的滚动位置时非常有用

---

它不像浏览器那样流畅地滚动，但每次滚轮触发事件时，它都会将垂直滚动位置更改30像素。我在代码中省略了注释行，以说明如何实现这一点。然而，对我来说，这导致了快速滚动时感觉非常滞后的滚动。

我最终手动跟踪了所需的滚动位置，并且完全不允许正常的滚动事件

var wantedScrollTop = 0;
$('.popupBody').bind('mousewheel', function (e, d) {
    var t = $(this);
    var scrollTo;
    if (d > 0) {
        scrollTo = Math.max(0, wantedScrollTop - 30);
    } else if (d < 0) {
        scrollTo = Math.min(t.get(0).scrollHeight - t.innerHeight(), wantedScrollTop + 30);
    }
    if (typeof scrollTo !== "undefined") {
        wantedScrollTop = scrollTo;
        t.scrollTop(wantedScrollTop);
        //t.stop().animate({ scrollTop: wantedScrollTop + 'px' }, 150);
    }
    e.preventDefault();
});

var wantedScrollTop=0；
$（'.popubody'）.bind（'mousewheel'，函数（e，d）{
var t=$（本）；
var-scrollTo；
如果（d>0）{
scrollTo=Math.max（0，wantedScrollTop-30）；
}else如果（d<0）{
scrollTo=Math.min（t.get（0.scrollHeight-t.innerHeight（），wantedScrollTop+30）；
}
如果（滚动条的类型！=“未定义”）{
wantedScrollTop=scrollTo；
t、 scrollTop（wantedScrollTop）；
//t、 stop（）.animate（{scrollTop:wantedScrollTop+'px'}，150）；
}
e、 预防默认值（）；
});

d

是滚动方向，所以我在这里手动跟踪想要的滚动位置。在我的例子中，一次只有一个弹出窗口，因此我没有费心将

wantedScrollTop

粘贴在元素的

数据-

属性或类似属性中，这在有多个元素需要跟踪它们自己的滚动位置时非常有用

---

它不像浏览器那样流畅地滚动，但每次滚轮触发事件时，它都会将垂直滚动位置更改30像素。我在代码中省略了注释行，以说明如何实现这一点。然而，对我来说，这导致了快速滚动时感觉非常滞后的滚动。

对解决方案感兴趣@headkit我已经用一个可行的解决方案回答了我自己的问题，并且对一个解决方案感兴趣@我已经用一个可行的解决方案回答了我自己的问题