jQuery监听上划下滑手势

jQuery监听上划下划手势

$(document).ready(function() {  
    var startY = 0; // 初始触摸位置Y坐标  
    var touchStart = false; // 标记是否开始触摸  
  
    // 监听touchstart事件  
    $('body').on('touchstart', function(e) {  
        touchStart = true; // 标记触摸开始  
        startY = e.originalEvent.touches[0].pageY; // 获取触摸点Y坐标  
    });  
  
    // 监听touchmove事件  
    $('body').on('touchmove', function(e) {  
        if (!touchStart) return; // 如果未开始触摸，则直接返回  
  
        var moveY = e.originalEvent.touches[0].pageY; // 获取移动时的Y坐标  
  
        // 判断是否上划  
        if (moveY < startY) {  
            // 这里写上划时你希望执行的代码  
            console.log('上划了！');  
        }  
  
        // 更新startY为当前触摸位置，用于后续比较  
        startY = moveY;  
    });  
  
    // 监听touchend事件，可选，用于重置状态  
    $('body').on('touchend', function(e) {  
        touchStart = false; // 重置触摸状态  
    });  
});