mousewheel事件在firefox浏览器中没有触发

请参考以下代码。

$(this.element).on("mousewheel", this.chartMouseWheel); chartMouseWheel:function(e) { if(e.originalEvent.wheelDelta /120 > 0) { alert('scrolling up !'); } else{ alert('scrolling down !'); } if (e.preventDefault) e.preventDefault(); e.returnValue = false; }, 

这个事件在IE中正确触发，Chrome并没有在Firefox中触发？

Answer 1

从版本3开始，Firefox无法识别“鼠标滚轮”。您应该使用“DOMMouseScroll”代替firefox。

检查一下： http ： //www.javascriptkit.com/javatutors/onmousewheel.shtml

Answer 2

这是2017年，现在正确的答案是：

 $(window).on('wheel', function(event){ // deltaY obviously records vertical scroll, deltaX and deltaZ exist too if(event.originalEvent.deltaY < 0){ // wheeled up } else { // wheeled down } }); 

适用于当前的Firefox 51，Chrome 56，IE9 +

注意：增量的值取决于浏览器和用户设置。

Answer 3

使用wheel事件。 此页面还为旧浏览器提供polyfills https://developer.mozilla.org/en-US/docs/Web/Events/wheel

Answer 4

Badri是对的，你应该使用“DOMMouseScroll”代替firefox。 除此之外，对于delta，您需要使用event.originalEvent.detail而不是event.originalEvent.wheelDelta。 对于down，event.originalEvent.detail给出正值，而event.originalEvent.wheelDelta给出负值，反之亦然。

  $(stage.content).on('mousewheel DOMMouseScroll', zoomHelper.zoom); if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) { if (event.originalEvent.detail > 0) { //scroll down delta = 0.2; } else { //scroll up delta = 0; } } else { if (event.originalEvent.wheelDelta < 0) { //scroll down delta = 0.2; } else { //scroll up delta = 0; } } 

JSFiddle（适用于IE 11，Firefox 33和Chrome 38，我没有测试其他浏览器）： http ： //jsfiddle.net/rpaul/ckwu7u86/3/

Answer 5

或者只使用jquery-mousewheel jQuery插件。

Answer 6

这似乎适用于Safari，Chrome和Firefox（我还没有在IE中测试过）：

 // For Chrome window.addEventListener('mousewheel', mouseWheelEvent); // For Firefox window.addEventListener('DOMMouseScroll', mouseWheelEvent); function mouseWheelEvent(e) { var delta = e.wheelDelta ? e.wheelDelta : -e.detail; console.log(delta); }