zoukankan      html  css  js  c++  java
  • 微信小程序区分点击,长按事件

      在上代码之前,微信小程序点击事件,长按事件的触发顺序需要我们了解一下下

      事务分类

        touchstart:手指触摸

        longtap:手指触摸后后,超过350ms离开

        touchend:手指触摸动作结束

        tap:手指触摸后离开

    事件 触发顺序
    单击 touchstart → touchend → tap
    长按 touchstart → longtap → touchend → tap

      通过上表格可以发现,单击事件与长按事件的区别就在于 longtap事件,所以我们通过longtap事件进行区分。现在可以开始上代码啦

      .xwml  文件

      <view >
        <image  src='{{urls}}' class="asd" mode="aspectFit" bindtap='nophonefull' id="{{urls}}"  bindlongtap="bingLongTap" bindtouchstart="touchStart" bindtouchend="touchEnd"></image>
      </view>
     
      .js  文件
      //定义用到的变量
      data: {
        startTime:0,   //点击开始时间
        endTime:0  //点击结束时间
      }
      //手指触摸开始赋值
      touchStart: function (e) {
        this.startTime = e.timeStamp;
      }
      //手指触摸结束赋值
      touchEnd: function (e) {
        this.endTime = e.timeStamp;
      }
      // nophonefull 不管点击还是长按都会触发的事件
      nophonefull: function () {
        //通过判断手指触摸时间来判断是否是点击事件,当时间差小于350时,为点击事件
        if (this.endTime - this.startTime < 350) {
          //这里可以做点击事件的处理啦
        }
      }
      //只有长按事件才会触发 
      bingLongTap : function(e){
        //这里可以做长按事件要处理的
      }
     
      以上就是区分点击事件和长按事件的方法啦,如果有不对的地方或者有跟简单的方法,欢迎留言
     
     

        

  • 相关阅读:
    [转] Java的打包apk, jar、war、ear包
    查看网络端口
    adb删除系统软件
    打开大文件的方法
    转载:Adb远程连接Android系统(通过网络使用ADB(Connect to android with wifi))
    网站后台语言(笔记)
    mysql和mysqli使用笔记
    Data Management Technology(5) -- Recovery
    Data Management Technology(4) -- 关系数据库理论
    Data Management Technology(3) -- SQL
  • 原文地址:https://www.cnblogs.com/ttqi/p/10248213.html
Copyright © 2011-2022 走看看