如何用JavaScript/jQuery禁用Div的鼠标滚轮拖动平移功能？

这个情况我之前碰到过！你设置的overflow-y:hidden只是隐藏了滚动条并阻止了常规滚动操作，但部分浏览器的拖拽滚动功能（按住鼠标滚轮后拖动鼠标的那种滚动）还是能绕过这个限制，让Div内容发生偏移。下面给你两种可靠的解决方案：

方案一：使用CSS overscroll-behavior 属性（推荐） #

这是最简洁的纯CSS方案，直接阻止元素的滚动溢出行为，包括这种拖拽滚动。给你的.A类添加这个属性：

.A {
  max-height: 100px;
  overflow-y: hidden;
  /* 完全阻止任何溢出滚动行为 */
  overscroll-behavior: none;
}

overscroll-behavior: none会禁用元素所有的滚动溢出效果，不管是滚轮滚动还是拖拽滚动都无法触发内容偏移。它的兼容性很好，现代主流浏览器（Chrome、Firefox、Edge）都支持，不用考虑IE的话这个方案首选。

方案二：JavaScript阻止滚轮事件默认行为 #

如果CSS方案在某些特殊场景下不生效，可以用JS直接拦截滚轮相关事件，阻止默认行为：

const targetDiv = document.querySelector('.A');
// 拦截滚轮事件，禁止默认滚动行为
targetDiv.addEventListener('wheel', function(e) {
  e.preventDefault();
}, { passive: false });

// 额外补充：防止选中内容后拖动导致偏移
targetDiv.addEventListener('selectstart', function(e) {
  e.preventDefault();
});

这个方案通过拦截wheel事件，直接禁止浏览器处理滚轮相关的滚动操作，包括拖拽滚动。加上selectstart的拦截还能避免用户选中内容后拖动导致的偏移问题。

你可以根据自己的需求选择其中一种方案，第一种更简洁，第二种兼容性覆盖更广（比如适配一些旧版浏览器）。

内容的提问来源于stack exchange，提问作者omega