javascript - 我如何在没有大图书馆的情况下获得触摸事件

Question

我正在使用jquery，但我不想使用jquery mobile，因为它太大了，我认为我不需要它。我要做的就是获得一个触摸事件。这就是我所拥有的。

 $('#menuButton').on('click touchstart', function(){
  $('#menu').toggleClass('block')
 });

它只是一种工作，但似乎在我的手机上发射了两次。我想我应该以某种方式检查 touchstart 和 touchend 。希望这需要适用于所有类型的设备。谢谢！

Answer 1

看哪！触摸的生命周期：

1. 你的手指碰到玻璃 -> touchstart！
2. 你的手指离开玻璃 -> touchend！
3. 你的手指徘徊 - >点击！

现在鼠标点击的生命周期：

1. 你的手指按下按钮 - > mousedown！
2. 你的手指它消除了按钮的压力 - > mouseup！
3. 你的手指徘徊 - >点击！

如果您同时监听 touchstart 和 click，则该事件将在鼠标或触控板计算机上触发一次，在触摸设备上触发两次，因为您在生命周期中监听 2 个事件。

如果你真的想为桌面使用 click 和触摸设备的 touchstart（在很多情况下是个好主意），你可以这样做：

 var clickEvent = (isMobile)?'touchstart':'click';
 $('#menuButton').on(clickEvent, function(){
   $('#menu').toggleClass('block')
 });

你如何去寻找isMobile是另一回事。

---

更新：如果您对它的npm感兴趣，我已经编写了一个方便的脚本来检测移动设备isMobile