点击事件和触摸事件有什么区别？

Question

我正在开发一款可以在Android/iOS和桌面电脑上运行的应用程序。

我应该使用click事件还是tap事件?

它们之间有什么区别？

'tap'是否适用于桌面电脑？如果不是(我必须使用click)，那么我是否会错过tap相对于click的任何优势？

- Tiger

Answer 1

您可以使用 .on() 将函数绑定到多个事件：

$('#element').on('click tap', function() {
    ...
});

感谢 @bergie3000 指出了 这个

- tuned

---

你可能会在那个解决方案中遇到问题。请参见：https://dev59.com/22025IYBdhLWcg3wEhjr - bergie3000

我不明白为什么人们给这个点赞。它没有回答主要问题“点击事件和触摸事件有什么区别？” - DerZyklop

Answer 2

触摸事件和鼠标事件是完全不同的东西。它们不能互换使用。

话虽如此，我正在使用jQuery Touch Punch将触摸事件映射到它们的鼠标事件模拟，因此轻触变成了与单击相同的操作。这使得可以使用所有标准的jQuery UI功能，而无需进行任何特殊的触摸事件编程。它非常简单易用，并且在iDevices和Android上都能完美运行。

- ghoti

---

请问您能否详细说明它们之间的差异？ - xn.

@xn.：首先，mouseover、mousemove和mouseout是不同于touchstart、touchmove和touchend的事件。其次，尽管它们可以实现许多相同的结果，但功能略有不同——鼠标无法实现多点触控，而“点击并拖动”也无法使用手指完成。您可以使用我提到的工具将触摸事件映射到在功能上（虽然不是物理上）等效的鼠标事件。 - ghoti

Answer 3

很抱歉翻出老帖子，但对于任何正在使用jQuery和Phonegap的人:

如果将“click”事件分配给不应被点击的“div”，“p”等元素，则不会触发该事件，而“tap”则可以在任何元素上正常工作！我花了很长时间才注意到这一点。

结论是，如果您使用jQuery mobile开发某些东西，我建议使用“tap”而不是“click”，因为它可能会引起一些问题。

- Rokoco

---

你可以使用 cursor: pointer 让 div、p 等元素响应点击事件。 - Simon_Weaver

@Simon_Weaver 谢谢！这个解决了我在移动端必须用JS构建模糊监听器的问题，现在只需要使用body.mobile{pointer:cursor} CSS即可。太棒了！ - luchaos

Answer 4

我建议您查看jQM事件文档，当前文档在这里：

• http://jquerymobile.com/demos/1.1.1/docs/api/events.html

对于移动设备，请使用触摸事件；如果需要鼠标事件，则jQM也提供了虚拟鼠标事件。

虚拟鼠标事件是一组“虚拟”的鼠标事件，试图将鼠标和触摸事件抽象出来。这允许开发人员注册基本的鼠标事件侦听器，例如mousedown、mousemove、mouseup和click，并且插件会在幕后注册正确的侦听器，以在该设备上尽快调用侦听器。在触摸环境中，插件保留了事件触发的顺序，在传统的鼠标环境中可以看到，因此，例如，vmouseup始终在vmousedown之前分派，而vmousedown在vclick之前分派，等等。虚拟鼠标事件还规范化了如何从事件中提取坐标信息，因此，在基于触摸的环境中，坐标直接从事件对象的pageX、pageY、screenX、screenY、clientX和clientY属性中获取。

我并不是说'click'事件不起作用，因为它仍然有效，例如您可以单击一个按钮。但是移动设备和桌面设备之间会有不同的事件。

- Phill Pafford