首页 > 解决方案 > 如何禁用鼠标滚轮滚动

问题描述

我试过这个,它没有工作

$('body').bind("mousewheel", function() {
    return false;
});

然后我尝试了这个

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

它有时有效,但有时无效。

有没有办法禁用鼠标滚轮?

标签: javascriptjqueryhtml

解决方案


请注意,在当前版本的 Chrome 中,滚动和滚轮处理程序默认被视为被动处理,因此无法取消。请参阅功能信息

我不确定是否有办法使用 jQuery 的on方法指定活动处理程序,但你可以使用内置的addEventListener. 此外,在这种情况下return false不起作用,您需要调用preventDefault().

document.body.addEventListener('wheel', function(e){ e.preventDefault(); }, { passive: false });
p { width: 320px; }
<p>Lorem ipsum dolor sit amet, audire facilis no pri, ea eam duis laboramus, at pro atqui tollit meliore. Vis ut malorum vocibus percipit, nisl atqui ea sea. Illud errem te vix, ex facer omittam his. Ne sit consul suscipit. Eu usu percipit efficiendi dissentiet.</p>
<p>Te ius dictas oporteat facilisi. Dicta diceret debitis et vim. Paulo insolens comprehensam est cu, dolor assueverit eu mei. Pro an facilisis rationibus. Summo molestie mei cu. His nobis erroribus in, iuvaret repudiare delicatissimi mea ut, nec at elit nostro.</p>
<p>Ad augue invenire efficiendi qui, facilisi mediocritatem ei duo. Ceteros mnesarchum et has, at ius choro dolor verear. Purto sententiae interesset et vim, quis nisl facer vix ei. Est agam ocurreret assentior id, et partem fabellas vim.</p>

我已经在 Chrome 73 和 Firefox 66 中测试过解决方案。为确保它适用于所有浏览器,请务必阅读MDNquirksmode


推荐阅读