targetTouches是否跟踪多个元素同时移动的触摸？

Question

假设我有四根手指：元素A中的两根手指（1,2）和元素B中的两根手指（3,4）。

假设我然后移动手指1和手指3.

我应该看一个touchmove事件，其中包含changedTouches包含手指1和3的事件。

然而targetTouches会包含什么？它是否包含1和2，或3和4，或全部4？

似乎提供关于1和2在同一元素上且3和4都在不同元素上的事实的足够信息的唯一方法是发送 2 {{1} }事件。

我正在构建一个触摸框架，我一直在构建一个跟踪所有手指及其目标的全局数据结构，所以我确实知道发生了什么，但我想知道是否有可能完全跳过这样做{{1事件可以为我提供所需的所有信息。

我在我的网页上使用touchmove对其进行了测试：

targetTouches

我按照上面描述的顺序放下四根手指。接下来，我将尝试查看我是否可以找出touchstart中包含哪些targetTouches，这是一项更困难的任务，因为它生成了多少数据。

Answer 1

我将在下面的Nexus 7上发布iOS6.0（iPhone 5），iOS5.1.1（iPad 3），Android 4.2.1上的Nexus 7（Chrome 18.0.1025469）和Android 17上的Firefox。

目前只有来自iPhone 5的数据。这是很多工作。

我所做的是在页面和touchstart调用preventDefault()中制作两个元素以防止滚动。然后我touchmove计算其changedTouches和targetTouches缓冲区的长度，并在DOM中显示它。此外，我计算了事件发生的速度。以下是代码片段：

// exposed is a variable which other code uses rAF to present a representation of it on the DOM so I can view it
touchmove: function(evt) { 
    evt.preventDefault(); 
    var time = Date.now();
    var diff = time - exposed.touch_move_last_time; 
    if (!exposed.touch_move_last_time) exposed.touch_move_last_time = Date.now();
    if (!exposed.touch_move_rate) exposed.touch_move_rate = 0;
    exposed.touch_move_last_time = time;
    exposed.touch_move_rate += (diff - exposed.touch_move_rate)*0.01;
    exposed.touch_move_changedTouches_count = evt.changedTouches.length;
    exposed.touch_move_targetTouches_count = evt.targetTouches.length;

当我移动手指时，我将其移动成圆形而不是锯齿形，因为在锯齿形点处它可以发射比采样率更少的事件。由于低收敛率（这是为了产生不会保持波动的数字），需要大约5秒的持续摩擦才能使读数稳定在采样率上。

iOS6.0：

将两根手指放在一个元素中，然后用一根手指移动：
changedTouches大小：1（移动的那个）
targetTouches大小：2（元素上的两个手指）
采样率：16.66ms

将两根手指放在一个元素中并四处移动：
changedTouches大小：2（两者都在移动）
targetTouches大小：2（元素上的两个手指）
采样率：16.66ms

在每个元素中放下一根手指并移动一根手指：
changedTouches大小：1（移动的那个）
targetTouches大小：1（指最初被移动的元素触及的元素）
采样率：16.66ms

在每个元素中放下一根手指并移动两根手指：
changedTouches大小：1（移动的那个）
targetTouches大小：1（指最初被移动的元素触及的元素）
采样率：8.29ms

在第一个元素中放下一根手指，在第二个元素中放下两根手指：
如果在第二个元素中移动一根手指
changedTouches大小：1
targetTouches大小：2
采样率：16.66ms

如果在第二个元素中移动两个手指 changedTouches大小：2
targetTouches大小：2
采样率：16.6ms（真的很难让第一根手指不动）

如果在第一个元素中移动手指
changedTouches大小：1
targetTouches大小：1
采样率：16.66ms

如果在第一个元素中移动手指而在第二个元素中移动一个手指 changedTouches大小：1
targetTouches大小：在1到2之间波动 采样率：8.29ms

如果移动所有三个手指

changedTouches大小：在1到2之间波动 targetTouches大小：2 采样率：约8.3ms

在每个元素中放下两根手指，并在每个元素中移动一个：
changedTouches大小：1
targetTouches大小：2
采样率：约9ms

很明显，所有采样率约为120Hz的情况我至少有两个手指在其中移动的元素，这似乎表明它会为每个同时触摸的元素触发一个单独的touchmove 。我敢打赌，将测试扩展到3个元素会看到180Hz的采样率。更新：我在iPad上测试了3个元素，确实产生了5.4毫秒的读数。

对我来说有点好奇的是为什么我总是得到8.29ms而不是8.33ms。 9ms读数可能只是因为它处理的速度超过了全速处理（因为我每帧都有DOM更新）

另一个更新：

在Nexus 7上的Chrome上，changedTouches缓冲区似乎总是充满了所有触摸，因为webkitForce读数始终在每次触摸时都在变化。它也是如此之慢，以至于采样率读数没有给出有用的信息。但是，通过更改页面上最后排序元素中存在的手指数量，似乎touchmove事件也在每个元素的基础上正确触发。

Nexus 7上的Firefox在产生合理的采样率读数方面要好一些，但显示器的更新比Chrome更加缓慢。在Firefox变得不那么不稳定之前，我认为值得努力让代码正常工作。