javascript - Firefox 中的 Highcharts 鼠标滚轮滚动事件

Question

我有一个带有鼠标滚轮滚动事件的 Highcharts 组件。

除 firefox 外，所有浏览器均正常运行。在 Firefox 中，mousewheel 事件会触发 Highcharts 组件和整个窗口的滚动。我尝试添加 event.preventDefault() 和 event.stopPropagation() 但这并没有解决问题。有什么办法可以防止滚动Highcharts组件时整个窗口都滚动吗？

Answer 1

出现问题是因为 DOMMouseScroll 和 mousewheel 事件现在已弃用，并由新的 wheel 事件取代，适用于所有浏览器。您需要替换代码中的两个内容才能使其正常工作。

首先，请在这里更改事件名称:

H.addEvent(chart.container, 'wheel', function(event) {

然后在您的 wheel 事件函数体中将 delta 赋值替换为:

delta = e.detail || -(e.deltaY / 120);
delta = delta < 0 ? 1 : -1;

现在它在所有浏览器上都以相同的方式工作。

实例: http://jsfiddle.net/d3r8pb7c/

API 引用:

https://developer.mozilla.org/en-US/docs/Web/Events/wheel

https://developer.mozilla.org/en-US/docs/Web/Events/mousewheel

https://developer.mozilla.org/en-US/docs/Web/Events/DOMMouseScroll