javascript - 使用触控板时捕获滚轮/鼠标滚轮事件的边缘替代解决方案

Question

Edge 上存在一个错误，当您使用精密触控板时，滚轮/mousehweel 事件不会触发。

https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7134034/

该问题显示为“已修复”，但尚未修复(在联想笔记本电脑和带有 Edge 最新版本的 Surface Pro 上测试)

有什么办法可以捕获这个事件吗？我尝试使用覆盖元素并捕获滚动事件，它可以工作，但由于该覆盖，您无法单击页面上的任何内容，并且不给它指针事件:none 会禁用滚动事件。

有什么想法吗？

Answer 1

在您指出的未决问题中，Microsoft Edge 团队表示，该问题已通过实现 PTP 指针事件解决，如 this blog post 中所述。 .

In HTML, add the touch-action CSS property to your target element to prevent the browser from executing its default touch behavior in response to gestures:

<canvas height=400 width=400 id="canvas" style="touch-action: none;"></canvas>

In JavaScript, attach a Pointer Event listener to your target element. You can determine the type of pointer that caused the handler to be invoked using the pointerType property of the event object passed into the event listener callback:

document.getElementById('canvas').addEventListener('pointermove', function(event) {
    console.log('pointermove!');
});

您可以引用this doc有关积分事件的更多详细信息。