javascript - e.touches、e.targetTouches 和 e.changedTouches 的变体

Question

假设我正在监听 body 元素上的 touchstart、touchmove 和 touchend。

如果我错了请告诉我，但我认为 e.touches 与 e.targetTouches 相同？如果是这样，e.changedTouches 与它们的关系如何变化？

我的意思是，在给定的时刻给定一个触摸，我获取触摸事件并解析它。根据我的经验，所有三个触摸变量都是相同的。

我必须将解析后的数据发送到服务器，发送三次完全相同的字符串是非常多余的，没有任何方法可以发送一次并以编程方式在服务器上重现 touchevent 吗？

Answer 1

我们有以下列表:

• touches:当前触摸屏幕的每个手指的信息列表
• targetTouches:类似于触摸，但被过滤为仅包含在同一节点内开始的手指触摸的信息
• changedTouches:事件中涉及的每个手指的信息列表

为了更好地理解这些列表中可能包含的内容，让我们快速浏览一些示例。它们根据以下规则变化:

• 当我按下手指时，所有三个列表都将包含相同的信息。它将在 changedTouches 中，因为放下手指是导致事件的原因
• 当我放下第二根手指时，touches 将有两个项目，每个手指一个。 targetTouches 仅当手指与第一个手指放在同一节点时才会有两个项目。 changedTouches 将包含与第二根手指相关的信息，因为它是导致事件的原因
• 如果我同时放下两根手指，changedTouches 中可能有两项，每根手指一个
• 如果我移动手指，唯一会改变的列表是 changedTouches，它将包含与移动的手指(至少一个)相关的信息。
• 当我抬起一根手指时，它会从 touches、targetTouches 中移除，并且会出现在 changedTouches 中，因为这是导致事件的原因
• 移除我的最后一根手指将使 touches 和 targetTouches 为空，changedTouches 将包含最后一根手指的信息