防止滑动的时候触发点击事件

//防止滑动的时候触发点击事件
const tap = (sprite, cb) => {
  var tapStartTime = 0,
    tapEndTime = 0,
    tapTime = 300, //tap等待时间,在此事件下松开可触发方法
    tapStartClientX = 0,
    tapStartClientY = 0,
    tapEndClientX = 0,
    tapEndClientY = 0,
    tapScollHeight = 15, //水平或垂直方向移动超过15px测判定为取消(根据chrome浏览器默认的判断取消点击的移动量)
    cancleClick = false;
  sprite.on('touchstart', function () {
    console.log(11111)
    console.log(cancleClick)
    tapStartTime = event.timeStamp;
    console.log(tapStartTime)
    var touch = event.changedTouches[0];
    tapStartClientX = touch.clientX;
    tapStartClientY = touch.clientY;
    cancleClick = false;
  })
  sprite.on('touchmove', function () {
    console.log(22222)
    console.log(cancleClick)
    var touch = event.changedTouches[0];
    tapEndClientX = touch.clientX;
    tapEndClientY = touch.clientY;
    if ((Math.abs(tapEndClientX - tapStartClientX) > tapScollHeight) || (Math.abs(tapEndClientY - tapStartClientY) > tapScollHeight)) {
      cancleClick = true;
    }
  })
  sprite.on('touchend', function () {
    console.log(33333)
    console.log(cancleClick)
    tapEndTime = event.timeStamp;
    console.log(tapEndTime)
    if (!cancleClick && (tapEndTime - tapStartTime) <= tapTime) {
      cb();
    }
  })
};





 tap(btn2, function () {
          open('http://baidu.com');
  });
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容