JS:event.touches属性如何工作?

Tin*_*ina 11 javascript jquery ipad touches ios

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

event.touches.length
Run Code Online (Sandbox Code Playgroud)

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

$('.image').bind('touchstart', function(event) {
  alert(event.touches.length);
});
Run Code Online (Sandbox Code Playgroud)

但这有效:

$('.image').bind('touchstart', function() {
  alert(event.touches.length);
});
Run Code Online (Sandbox Code Playgroud)

不应该反过来吗?

T.J*_*der 18

在第二种情况下,你会回到浏览器的全局(和原始)event对象而不是jQuery特定的对象(在支持全局的浏览器上event,而不是所有的 - 例如Firefox不支持 - 因为它是Microsoft事情只有其他人复制了).

听起来jQuery没有touches在其自定义事件对象中传递属性.如事件对象的文档中所述,您可以event.originalEvent在第一个示例中使用它来访问它具有的"特殊属性",同时仍然可以获得jQuery规范化事件对象的好处,例如:

$('.image').bind('touchstart', function(event) {
  alert(event.originalEvent.touches.length);
});
Run Code Online (Sandbox Code Playgroud)

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

jQuery.event.props.push("touches");
Run Code Online (Sandbox Code Playgroud)

...那么你的第一个例子应该开始工作了.


旁注:如果你没有使用jQuery Touch,你可能会看一下.我的猜测是,除了它做的其他事情之外,它还添加了touches如上所示的属性(但这只是猜测).