touch事件之上下左右滑

Posted 2020-09-30

var startX, startY, moveEndX, moveEndY;
$(‘body‘).on(‘touchstart‘, function(e) {
  e.preventDefault();
  startX = e.touches[0].pageX,
  startY = e.touches[0].pageY;
});
$(‘body‘).on(‘touchmove‘, function(e) {
  e.preventDefault();
  moveEndX = e.touches[0].pageX,
  moveEndY = e.touches[0].pageY,
  X = moveEndX - startX,
  Y = moveEndY - startY;
   if (Math.abs(X) > Math.abs(Y) && X > 0) {//从左往右滑
    doSomethingOne();
  }else if (Math.abs(X) > Math.abs(Y) && X < 0) {//从右往左滑
    doSomethingTwo();
  }else if(Math.abs(Y) > Math.abs(X) && Y > 0) {//从上往下滑
    doSomethingThree();
  }else if(Math.abs(Y) > Math.abs(X) && Y < 0) {//从下往上滑
    doOtherThingFour();
  }
});