Javascript 鼠标滚轮在容器内滚动-捕获事件

我有一个具有内部可滚动DIV的页面。当我将鼠标悬停在该页面上并尝试使用鼠标滚轮滚动该页面时，该DIV的内容会根据需要滚动，而主页保持不变。但当我到达DIV滚动区域的底部时，整个页面开始滚动

我已经尝试在该div上设置事件处理程序，但是

preventDefault（）

方法也阻止了div本身的滚动

下面是错误的代码：

$（'.folderlist'）。在（'DOMMouseScroll mousewheel'，函数（ev）上{
ev.stopPropagation（）；
ev.preventDefault（）；
})

preventDefault（）

防止页面滚动，但也不允许滚动DIV

stopPropagation（）

我想在这种情况下什么都不做

我错过什么了吗

$('.folderlist').hover(function (){
    $('body').css('overflow','hidden');
}, function (){
    $('body').css('overflow','auto');
})

试试看。。我想它应该可以工作了，并且提出了一个很好的解决方案，尽管它在IE上有问题，所以我已经试着解决了，现在你可以：

function stopEvent(e) {
    e = e ? e : window.event;
    if (e.stopPropagation) e.stopPropagation();
    if (e.preventDefault) e.preventDefault();
    e.cancelBubble = true;
    e.cancel = true;
    e.returnValue = false;
    return false;
}

$.fn.extend({
    // param: (boolean) onlyWhenScrollbarVisible
    // If set to true, target container will not intercept mouse wheel
    //     event if it doesn't have its own scrollbar, i.e. if there is too
    //     few content in it. I prefer to use it, because if user don't see
    //     any scrollable content on a page, he don't expect mouse wheel to
    //     stop working somewhere.

    scrollStop: function(onlyWhenScrollbarVisible) {
        return this.each(function(){
            $(this).on('mousewheel DOMMouseScroll', function(e) {
                if (onlyWhenScrollbarVisible && this.scrollHeight <= this.offsetHeight)
                    return;

                e = e.originalEvent;
                var delta = (e.wheelDelta) ? -e.wheelDelta : e.detail;
                var isIE = Math.abs(delta) >= 120;
                var scrollPending = isIE ? delta / 2 : 0;
                if (delta < 0 && (this.scrollTop + scrollPending) <= 0) {
                    this.scrollTop = 0;
                    stopEvent(e);
                }
                else if (delta > 0 && (this.scrollTop + scrollPending >= (this.scrollHeight - this.offsetHeight))) {
                    this.scrollTop = this.scrollHeight - this.offsetHeight;
                    stopEvent(e);
                }
            });
        });
    }
});

函数停止事件（e）{
e=e？e:window.event；
如果（e.stopPropagation）e.stopPropagation（）；
如果（e.preventDefault）e.preventDefault（）；
e、 取消气泡=真；
e、 取消=真；
e、 returnValue=false；
返回false；
}
$.fn.extend({
//param：（布尔）仅显示HensCrollBarVisible
//如果设置为true，目标容器将不会拦截鼠标滚轮
//事件，如果它没有自己的滚动条，即如果有
//里面的内容很少。我更喜欢用它，因为如果用户看不到的话
//页面上任何可滚动的内容，他都不希望鼠标滚轮
//在什么地方停止工作。
scrollStop:功能（仅显示滚动条）{
返回此值。每个（函数（）{
$（this）.on（'mousewheel-DOMMouseScroll'，函数（e）{
如果（仅限Henswerscrollbar可见&&this.scrollHeight=120；
var scrollPending=isIE？增量/2:0；
如果（delta<0&&（this.scrollTop+scrollPending）0&&（this.scrollTop+scrollPending>=（this.scrollHeight-this.offsetHeight）））{
this.scrollTop=this.scrollHeight-this.offsetHeight；
停止事件（e）；
}
});
});
}
});

现在它正是我想要的。谢谢你的博文-

---

示例用法：

$（'.folderlist'）.scrollStop（true）；

它可以工作，但主页滚动条在mouseenter/mouseleave上会闪烁，这不是好消息！很荣幸能解决您自己的问题