Javascript控制盘事件锁定为水平或垂直移动，不允许对角移动

我正在尝试使用wheel事件来允许两个手指在PC触控板上移动。下面是示例代码：

window.addEventListener（'wheel'，event=>{
console.log（event.deltaX、event.deltaY）
})

我的期望是，当我在触控板上执行两个手指的移动时，deltaX和deltaY将会改变。我发现，一旦你开始两个手指的水平或垂直运动，它会锁定到那种类型的运动，并强制deltaY为0（水平运动）或deltaX为0（垂直运动）。如果您从对角线运动开始，那么它将按预期工作，并正确更改deltaX和deltaY

我不确定这是一个特定于触摸板的问题（我在Surface Book 2上）还是一个Javascript怪癖，或者我遗漏了什么

您可以在此处看到这一点：

将触摸板上的两个手指水平移动到盒子上

将手指放在触摸板上，然后尝试垂直移动（至少在PC/chrome上不能）

重复垂直，然后水平

从两个手指沿对角线方向移动开始，查看我正在寻找的运动范围

说

当鼠标滚轮绕任何轴旋转时，或当等效输入设备（如鼠标球、某些平板电脑或触摸板等）模拟了此类操作时，用户代理必须发送此事件。根据平台和输入设备的不同，对角车轮三角洲可以作为具有多个非零轴的单车轮事件交付，也可以作为每个非零轴的单独车轮事件交付

假设您的浏览器正确地实现了它，它会建议您可能需要处理多个事件，而不是单个事件

---

我想确认这肯定是一个浏览器问题，因为听起来软件/windows更有可能锁定坐标以使您能够更平滑地滚动。

这是Chrome浏览器的设计行为，他们目前没有计划更改它：

铬合金锁定“车轮”事件的方向，以便在车轮开始水平或垂直移动时，将垂直增量设置为0

---

这限制了在PC触摸板上使用两个手指的非点击移动（例如，用两个手指在地图上滚动），但如果没有铬元素的变化，我看不到前进的道路。

使用

滚动

事件替代对我的场景不起作用。我正在编写一个使用固定大小的画布但不滚动的视口。本机滚动处理程序是否也会发生同样的情况？例如。如果不是，那可能是操作系统的限制。请注意，在带有macbook触控板的macOs上，它在Firefox和Safari上运行良好。然而，Chrome在这里做了一些非常奇怪的事情，它将

addEventListener

之一的

passive

选项默认为

true

，这意味着您将无法阻止那里事件的默认行为。您必须在此浏览器中将此选项设置为false yourself：不过，Safari有手势事件，因为它很特殊。甚至是一个操作系统。检查您的系统偏好，如果有什么事情可能与此有关。（显然，你不能要求你的用户也这样做，但这可能有助于缩小问题的核心）。哦，现在我在我的手机上，我意识到我的Android也在FF上这样做。谢谢你的评论。这似乎是Chrome/PC的问题。我在Firefox/PC上进行了测试，没有发现方向锁定问题。可能值得报告为一个bug

https://bugs.chromium.org/p/chromium/issues/list

提交时很酷，看起来不错。可能想链接到我上面提到的w3c规范引用，并注意它在其他浏览器中工作，因此人们可以看到错误在于实现与规范不匹配