【问题标题】：JavaScript onScroll event.preventDefault()JavaScript onScroll event.preventDefault()
【发布时间】：2017-07-02 17:23:37
【问题描述】：
有什么方法可以在滚动事件中使用preventDefault？容器必须有overflow-y: scroll。我不想使用mousewheelpreventDefault，因为那样我就不得不为鼠标、键盘、触摸屏和滚动条编写解决方案。
那么，如何在下面的<div> 中禁用滚动？ (jsfiddle)
document.getElementById('container').onscroll = function(event) {
event.preventDefault();
};
div {
height: 300px;
overflow-y: scroll;
width: 400px;
}
<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
【问题讨论】：
标签：
javascript
scroll
preventdefault
【解决方案1】：
您可以在特定元素上使用scrollTo() 并将其滚动设置到上一个位置。假设原始位置是(0,0)，您可以使用它。但是，如果它以某种方式发生变化，您将需要扩展逻辑以适应该变化。请记住，当用户尝试滚动时，会出现轻微的滚动中断。
工作演示
document.getElementById('container').onscroll = function(event) {
event.preventDefault();
document.getElementById('container').scrollTo(0,0);
};
div {
height: 300px;
overflow-y: scroll;
width: 400px;
}
<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
注意：我强烈建议不要这样做，因为拦截滚动事件会给页面的可用性带来很多麻烦，但如果你确定这一点，你必须做的！