移动端上下左右滑动事件

注意:要用on方法

$(".activity_goods").on("touchstart",'.activity_goods_left',function(e) {
            if (e.cancelable) {
                if (!e.defaultPrevented) {
                    e.preventDefault();
                }
            }   
            startX = e.originalEvent.changedTouches[0].pageX,
            startY = e.originalEvent.changedTouches[0].pageY;
        });
        $(".activity_goods").on("touchend", '.activity_goods_left',function(e) {       
            if (e.cancelable) {
                if (!e.defaultPrevented) {
                    e.preventDefault();
                }
            }               
            moveEndX = e.originalEvent.changedTouches[0].pageX,
            moveEndY = e.originalEvent.changedTouches[0].pageY,
            X = moveEndX - startX,
            Y = moveEndY - startY;
            // 左滑
            if (X<0) {
                let zix = $('.collection2_delete').width()-5;
                $(this).css('margin-left',-zix)
                $(this).siblings('.collection2_delete').show()                
            }
            // 右滑
            else if (X>0) {
                $(this).css('margin-left',0)
                $(this).siblings('.collection2_delete').hide()
            }
            // 上滑
            else if (Y<0) {return}
            // 下滑
            else if (Y>0) {return}
            // 点击
            else{return}
        });

猜你喜欢

转载自blog.csdn.net/wangle_style/article/details/82116348