javascript - 当我滚动到其中的 div 底部时，如何防止页面滚动？

Question

我的页面上有几个 div，如下所示：

<div style="height:200px; overflow:auto;">
    <div style="height:300px;">
        <!--Lots of text here-->
    </div>
</div>

当用户将鼠标悬停在它们上方并使用滚轮滚动时，它们可以很好地滚动。问题是，当用户到达底部时，页面本身开始滚动。

有没有办法阻止这种情况的发生（如果需要，使用 javascript），这样即使它已经滚动到底部并且页面本身只在用户没有悬停在 div 上时才会滚动，焦点仍然在 div 上？

Answer 1

检查这个演示：http: //jsfiddle.net/zUGKW/1/

代码：

// bind the mousewheel event
$('.myDiv').bind('mousewheel', function(e) {
    // if scroll direction is down and there is nothing more to scroll
    if(e.originalEvent.wheelDelta < 0 && 
    ($(this).scrollTop() + $(this).height()) >= this.scrollHeight) return false;
});