JS：event.touches属性如何工作？

Question

我不明白如何使用event.touches属性。例如，要获得iPad / iPhone上的手指数量，您应该使用

event.touches.length

那为什么这个示例代码不起作用？

$('.image').bind('touchstart', function(event) {
  alert(event.touches.length);
});

但这有效：

$('.image').bind('touchstart', function() {
  alert(event.touches.length);
});

不应该反过来吗？

Answer 1

在第二种情况下，您将回到浏览器的全局（和原始）event对象而不是jQuery特定的对象（在支持全局event的浏览器上），而不是所有的 - 例如，Firefox不会 - 因为它是微软的东西，只有其他人复制过了。）

听起来jQuery没有在其自定义事件对象中传递touches属性。如event object's documentation中所述，您可以在第一个示例中使用event.originalEvent来访问它所具有的“特殊属性”，同时仍然可以获得jQuery规范化事件对象的好处，例如：

$('.image').bind('touchstart', function(event) {
  alert(event.originalEvent.touches.length);
});

...或者您可以通过在脚本开头执行此操作一次告诉jQuery复制该属性：

jQuery.event.props.push("touches");

...于是你的第一个例子应该开始工作了。

---

附注：如果你没有使用jQuery Touch，你可能会看一下。我的猜测是，除了它做的其他事情之外，它还添加了touches属性，如上所示（但这只是猜测）。