var startX;
var startY;
var moveEndX
var moveEndY
var X
var Y


$("body").on("touchstart", function (e) {

    startX = e.originalEvent.changedTouches[0].pageX,
        startY = e.originalEvent.changedTouches[0].pageY;
});

$("body").on("touchmove", function (e) {
    moveEndX = e.originalEvent.changedTouches[0].pageX
    moveEndY = e.originalEvent.changedTouches[0].pageY
    X = moveEndX - startX
    Y = moveEndY - startY

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

$(".container").on("touchend",function(e){
    moveEndX = e.originalEvent.changedTouches[0].pageX
    moveEndY = e.originalEvent.changedTouches[0].pageY
    X = moveEndX - startX
    Y = moveEndY - startY

    if (X > 0) {
        // alert("left 2 right");
        console.log("上一个")
        prev_pic();
    }
    else if (X < 0) {
        // alert("right 2 left");
        console.log("下一个")
        next_pic()
    }
    else if (Y > 0) {
        // alert("top 2 bottom");
    }
    else if (Y < 0) {
        // alert("bottom 2 top");
    }
    else {
        // alert("just touch");
    }
})

参考博客:
js判断手指的上滑,下滑,左滑,右滑,事件监听

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐