js 如何分辨 mac 用户的触控板事件与鼠标滚动事件

2022-03-22 18:49:45 +08:00
 yxcoder

如题 mac 用户触控板,双指同向滑动(同时向上或者向下),双指反向滑动(放大与缩小功能),鼠标滚动,都使用的是 WheelEvent 事件,type 都是 wheel ,做交互的时候需要区分这三种情况,有啥好用稳定的方法吗?

3982 次点击
所在节点    JavaScript
8 条回复
also24
2022-03-22 19:08:38 +08:00
前阵子看到的……

yimity
2022-03-22 19:28:14 +08:00
比较好奇,有什么需求需要区分这个?
xy90321
2022-03-23 00:47:19 +08:00
chengyiqun
2022-03-25 10:24:08 +08:00
@xy90321 这个 event 应该是监听触屏的.
我没用过 mac, 但是按照我的理解, 触摸板子本身是一个兼容的 ps/2 鼠标. 所以里面的事件才和鼠标的事件是一样的吧.
这怎么区分?
chengyiqun
2022-03-25 10:27:32 +08:00
@xy90321 至少在 windows 上, 触摸板是被识别成一个鼠标设备的. 就算支持手势, 手势本身也只是类似游戏鼠标的各种功能键侧键的封装而已, 手势只能用他们预定的格式, 一个手势相当于一个功能键
yxcoder
2022-03-25 14:13:50 +08:00
@also24
@yimity
@xy90321
@chengyiqun

结贴:
分辨方法
1.鼠标滚轮 -> e.wheelDeltaY === (e.deltaY * -3)
yxcoder
2022-03-25 14:16:29 +08:00
@yxcoder 没输入完就发出去了.....

```
if (e.wheelDeltaY === (e.deltaY * -3)){
鼠标滚动
} else if (ctrlKey === true){
反向滑动
} else {
同向滑动
}
```

https://stackoverflow.com/questions/10744645/detect-touchpad-vs-mouse-in-javascript/62415754#62415754
yxcoder
181 天前
刚看到有人收藏,更好用的办法是

鼠标滚动在一段时间内是一个固定的值,譬如 3 or -3

但是由于人的操作不稳定,在一段时间内是一个变化的值,而且触发频率非常高

所以在刚开始滚动的时候记录一下,譬如 A ,在接下来的一段时间,譬如 3s 内,只要出现滚动值与初始值不一致,则判断为触摸板,否则判断为鼠标。注意,这个判断是个连续的过程。
换个思路,可以假设刚开始的时候就认为用户用的鼠标,在持续的滚动中只要出现与初始值不一样的滚动值,就立马改判触摸板,并且一个极短的时间内譬如 100ms 之内不触发事件,就结束此次判断,下次触发时再判断

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/842169

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX