移动端长按效果实现

Posted 2020-10-16 芦苇荡

移动端长按效果实现

基本实现原理：监听touchstart事件，使用setTimeout延时，如果松开则清除该定时器

举个例子

    var pressTimer = null;
    $(‘.circle-tip‘).on(‘touchstart‘,function (e) {
        e.preventDefault();
        e.stopPropagation();
        pressTimer = setTimeout(function () {
                        $(‘.package-pop‘).addClass(‘active‘);
                    },600)
    }).on(‘touchend‘,function(e){
        e.preventDefault();
        e.stopPropagation();
        clearTimeout(pressTimer);
        $(‘.package-pop‘).removeClass(‘active‘);
    })