在iPhone和Android上通过JavaScript检测手指滑动

Question

在iPhone和Android上通过JavaScript检测手指滑动

如何检测用户使用JavaScript在网页上向某个方向滑动手指？

我想知道是否有一个解决方案适用于iPhone和Android手机上的网站。

Answer 1

简单的vanilla JS代码示例：document.addEventListener('touchstart', handleTouchStart, false);        document.addEventListener('touchmove', handleTouchMove, false);var xDown = null;                                                        var yDown = null;function getTouches(evt) {   return evt.touches ||             // browser API          evt.originalEvent.touches; // jQuery}                                                     function handleTouchStart(evt) {     const firstTouch = getTouches(evt)[0];                                           xDown = firstTouch.clientX;                                           yDown = firstTouch.clientY;                                      };                                                function handleTouchMove(evt) {     if ( ! xDown || ! yDown ) {         return;     }     var xUp = evt.touches[0].clientX;                                         var yUp = evt.touches[0].clientY;     var xDiff = xDown - xUp;     var yDiff = yDown - yUp;     if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {/*most significant*/         if ( xDiff > 0 ) {             /* left swipe */          } else {             /* right swipe */         }                            } else {         if ( yDiff > 0 ) {             /* up swipe */          } else {              /* down swipe */         }                                                                      }     /* reset values */     xDown = null;     yDown = null;                                             };在Android中测试过。