Javascript 检测向上滚动不起作用_Javascript_Jquery

Javascript 检测向上滚动不起作用

javascript jquery

Javascript 检测向上滚动不起作用,javascript,jquery,Javascript,Jquery,我试图用这段代码来获取滚动方向问题是当向上滚动时检测不顺利 $(window).bind('DOMMouseScroll scroll mousewheel', function(event) { if (event.originalEvent.wheelDelta >= 0) { console.log('scroll up'); }else { console.log('scroll down'); }); }

我试图用这段代码来获取滚动方向问题是当向上滚动时检测不顺利

$(window).bind('DOMMouseScroll scroll mousewheel', function(event) {

    if (event.originalEvent.wheelDelta >= 0) {
          console.log('scroll up');
        }else {
          console.log('scroll down');
    });

});

这是一个屏幕截图，显示了向上滚动然后向下滚动的结果，但我没有向下滚动

您绑定了太多的事件

试试这段代码，唯一的区别是我在div上使用它

$('div').bind('mousewheel', function(event) {

    if (event.originalEvent.wheelDelta >= 0) {
          console.log('scroll up');
        }else {
          console.log('scroll down');
    }

});

这是一把正在工作的JS小提琴：

编辑：上述答案有效，但仅在使用滚轮滚动时有效。但是，也可以使用鼠标滚动窗口。如果你想处理好它，它会变得更复杂一点

我已经做了一个解决方案，可以监听onscroll事件，并简单地将当前scrolltop位置与上一个scrolltop位置进行比较，以确定滚动的方向

$('div').bind('scroll', function(event) {

  if ($(this).scrollTop() < $(this).data('last-scroll')) {
    console.log('scroll up');
  } else {
    console.log('scroll down');
  }

  $(this).data('last-scroll',$(this).scrollTop());
});

$（'div'）.bind（'scroll'，函数（事件）{
if（$（this.scrollTop（）<$（this.data（'last-scroll'））{
log（“向上滚动”）；
}否则{
log（“向下滚动”）；
}
$（this.data（'last-scroll'，$（this.scrollTop（））；
});

这独立于原始事件触发器工作

请看小提琴：

您绑定的事件太多了