js移動端頁面判斷左右滑動事件

實現原理：通過監聽touchstart事件獲取，初始的x軸、y軸座標，在通過監聽touchmove事件，獲取結束時候的x軸、y軸座標，他通過初始值與結束值比較，判斷是左滑還是右滑。
代碼：

var windowHeight = $(window).height(),
    　　$body = $("body");
    　　$body.css("height", windowHeight); //重要代碼
    　　$("body").on("touchstart", function(e) {
　　　　    e.preventDefault();
    　　　　startX = e.originalEvent.changedTouches[0].pageX,
    　　　　startY = e.originalEvent.changedTouches[0].pageY;
    　　});
    　　$("body").on("touchmove", function(e) {
    　　　　e.preventDefault();
    　　　　moveEndX = e.originalEvent.changedTouches[0].pageX,
    　　　　moveEndY = e.originalEvent.changedTouches[0].pageY,
    　　　　X = moveEndX - startX,
    　　　　Y = moveEndY - startY;

    　　　　if ( Math.abs(X) > Math.abs(Y) && X > 0 ) {
    　　　　　　alert("left 2 right");
    　　　　}
    　　　　else if ( Math.abs(X) > Math.abs(Y) && X < 0 ) {
    　　　　　　alert("right 2 left");
    　　　　}
    　　　　else if ( Math.abs(Y) > Math.abs(X) && Y > 0) {
    　　　　　　alert("top 2 bottom");
    　　　　}
    　　　　else if ( Math.abs(Y) > Math.abs(X) && Y < 0 ) {
    　　　　　　alert("bottom 2 top");
    　　　　}
    　　　　else{
    　　　　　　alert("just touch");
    　　　　}
    　　});

直接使用時，控制檯活報錯

這個時候在樣式文件裏面加入：

    * {
        touch-action: pan-y;
    }

就解決了

原文檔地址爲：https://www.cnblogs.com/lijuntao/p/6479972.html