仅在使用两根手指时在移动设备上激活 javascript touchmove

Question

我有一个动画区域，通过 javascript touchmove 事件为移动设备激活，但在水平移动屏幕上，存在向下滚动动画触摸区域的问题。这是我的代码

jQuery(".animatedPhone").bind('touchmove', function(jQueryEvent) {});

有没有办法仅当用户使用他的两个手指时才激活触摸移动，就像谷歌地图在移动设备上所做的那样？

我尝试了下面的代码

$(".animatedPhone").on("touchstart",function(e){
    if(!tapped){ //if tap is not set, set up single tap
        tapped = setTimeout(function(){
          tapped = null;
          //insert things you want to do when single tapped
        },300);   //wait 300ms then run single click code
    } else {    //tapped within 300ms of last tap. double tap
        clearTimeout(tapped); //stop single tap callback
        tapped = null;
        alert('double tapped');
    }
    e.preventDefault()
});

但是再次像这样，动画触摸区域不可滚动。

谢谢。

Answer 1

使用

TouchEvent.touches.length

https://developer.mozilla.org/ja/docs/Web/API/TouchEvent/touches

$(".animatedPhone").on("touchmove",function(e){
  if (e.touches.length < 2) return;
  // bra bra
})