jQuery禁止鼠标滚轮事件的方法是什么，如何完成？
发布时间：2022-02-08 14:56:50 所属栏目：语言 来源：互联网
导读：这篇文章给大家分享的是jQuery禁止鼠标滚轮事件的方法。一般我们在浏览网页的时候，能够通过鼠标滚轮实现上下滚动，但是有些场景下我们需要禁止滚动时间，对此下文就给大家来讲解鼠标滚轮事件的禁用和开启，文中的示例代码介绍得很详细，有需要的朋友可以参
|
这篇文章给大家分享的是jQuery禁止鼠标滚轮事件的方法。一般我们在浏览网页的时候，能够通过鼠标滚轮实现上下滚动，但是有些场景下我们需要禁止滚动时间，对此下文就给大家来讲解鼠标滚轮事件的禁用和开启，文中的示例代码介绍得很详细，有需要的朋友可以参考，接下来就跟随小编一起了解看看吧。 本文操作环境：windows7系统、jquery3.2.1版、DELL G3电脑 jquery怎么禁止上下滚动事件? jQuery禁用、开启鼠标滚轮事件 写一个网页的时候需要刚打开的时候是一个占满一屏的视频，想要禁用鼠标滚轮事件，通过点击向下的按钮使页面向下滑动过视频部分，所以查找了禁用鼠标滚轮的事件方法 1、禁用鼠标滚轮事件 $(document).bind('mousewheel', function(event, delta) {return false;}); 之后滑动过视频以后又要使用鼠标滚轮向下滑动，所以解绑事件，使鼠标滚轮可以使用 2、如果要开启鼠标滚轮事件，直接解绑事件就可以了 $(document).unbind('mousewheel'); 但是鼠标滚轮可以使用后，向上滚动就会回到视频部分，这时就会很尴尬的发现视频部分既可以用鼠标滚轮也可以用向下按钮，所以滑动到视频部分的时候要禁用鼠标滚轮事件。 怎么判断到了视频部分 1、首先判断我是向上滑动 ps:jQuery 半吊子，所以代码中又有js代码又有jquery代码 window.onscroll = function(){ p=$(this).scrollTop(); if(t>p){ console.log("向上滚动"); } t = p; }; 2、然后判断滚动条高度是否小于页面一屏的高度，这里加了一个获取一屏高度的函数 // 获取浏览器窗口的可视区域的高度 function getViewPortHeight() { return document.documentElement.clientHeight || document.body.clientHeight; } window.onscroll = function(){ p=$(this).scrollTop(); let height = getViewPortHeight(); if (p >= height){ $(document).unbind('mousewheel'); } if(t>p){ if (p < height) { $(document).bind('mousewheel', function(event, delta) { return false; }); $('html,body').animate({scrollTop:0},1000); } } } t = p; }; 但是这样就会无限的给document禁用或开启鼠标滚轮事件，so sad 3、获取事件已经绑定的事件 使用 $._data(obj[0],"event") var objEvt = $._data($(document)[0], 'events'); window.onscroll = function(){ p=$(this).scrollTop(); let height = getViewPortHeight(); if (p >= height){ $(document).unbind('mousewheel'); objEvt = $._data($(document)[0], 'events'); } if(t>p){ if (p < height) { if (!objEvt){ $(document).bind('mousewheel', function(event, delta) { return false; }); objEvt = $._data($(document)[0], 'events'); $('html,body').animate({scrollTop:0},1000); } } } t = p; };  （编辑：泉州站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
