美文网首页
H5模拟长按事件

H5模拟长按事件

作者: kelly_0416 | 来源:发表于2020-05-07 11:30 被阅读0次

    js

    var that = this;
    var timeOutEvent  = 0;
    that.map.addEventListener("touchstart",  function(e) {
      // 长按事件触发
      timeOutEvent = setTimeout(function() {
        timeOutEvent = 0;
        that.longpress(e);
      }, 500);
      //长按500毫秒
    });
    
      that.map.addEventListener("touchmove", function() {
        clearTimeout(timeOutEvent);
        timeOutEvent = 0;
      });
    
      that.map.addEventListener("touchend", function() {
        clearTimeout(timeOutEvent);
        if (timeOutEvent != 0) {
          // 点击事件
        }
        return false;
      }); 
    

    react

    this.timeOutEvent=null
     onTouchStart() {
        clearTimeout(this.timeOutEvent)
        this.timeOutEvent = setTimeout(() => {
         this.longpress()
        }, 500);
      }
      onTouchMove() {
        clearTimeout(this.timeOutEvent)
      }
      onTouchEnd() {
        clearTimeout(this.timeOutEvent)
      }
    

    相关文章

      网友评论

          本文标题:H5模拟长按事件

          本文链接:https://www.haomeiwen.com/subject/dzvoghtx.html