Javascript 触摸对象

Posted 2023-03-28

【中文标题】Javascript 触摸对象

【英文标题】：Javascript Touch Object

【发布时间】：2012-04-04 20:51:27

【问题描述】：

我正在尝试使用触摸事件在 javascript 中区分点击和滑动。我想知道，触摸事件对象中是否有一个属性可以检查以确定“touchend”事件的差异，或者您是否必须同时监听 touchstart 或 touchend 和 touchmove 事件？我试图最小化必须添加到 DOM 的事件侦听器的数量，并且想知道是否可以通过观察单个事件来做到这一点？具体来说，我正在查看 ios 上的 webkit。

【参考方案1】：

根本不绑定到点击事件。它的响应速度比触摸事件的集合慢得多。

要检查滑动，您需要监听 touchstart 和 touchend 事件。除非您计划在该事件触发时执行某些操作，否则不要担心 touchmove。

在 touchstart 事件中，您需要记录事件的 x/y 位置。在 touchend 事件中，再次执行相同操作。您还需要某种阈值，这样当您计算 x1-x2 和 y1-y2 之间的差异时，您就可以确定它是否是滑动。

Apple 在这里http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html 提供了一个涉及touchmove 的元算法。在该页面上搜索“识别滑动”即可找到。

我个人从来不需要使用 touchmove 并且成功地使用了我上面描述的技术。但是，这两种方法都是有效的方法，因此您应该研究最适合您的方法。

【讨论】：

感谢您的回答。我已经按照您的建议仅使用 touchstart 和 touchend 对此进行了编码，并在 DOM 中应用了更高的侦听器，这样我就不会为每个可以“单击”的单独组件添加事件，只是页面级别的每个事件之一.