博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信小程序区分点击,长按事件
阅读量:4348 次
发布时间:2019-06-07

本文共 1087 字,大约阅读时间需要 3 分钟。

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

  事务分类

    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){
    //这里可以做长按事件要处理的
  }
 
  以上就是区分点击事件和长按事件的方法啦,如果有不对的地方或者有跟简单的方法,欢迎留言
 
 

    

转载于:https://www.cnblogs.com/ttqi/p/10248213.html

你可能感兴趣的文章
BZOJ.1935.[SHOI2007]Tree园丁的烦恼(CDQ分治 三维偏序)
查看>>
c++可变参数(示例)
查看>>
4923: [Lydsy1706月赛]K小值查询 平衡树 非旋转Treap
查看>>
MySQL 配置文件详解
查看>>
maven 中央仓库地址
查看>>
实现页面查看xml或json数据类似控制台效果
查看>>
Kali配置教程
查看>>
Leetcode: Combination Sum IV && Summary: The Key to Solve DP
查看>>
获取动态类型变量的属性值
查看>>
C++冒泡排序
查看>>
js 数组操作
查看>>
第522篇--DataTable to Excel C#
查看>>
C++\virtual 虚函数、纯虚函数
查看>>
asp.net mvc 4多级area实现技巧
查看>>
Solr
查看>>
MySQL binlog数据库同步技术总结
查看>>
算法设计--查找无序数组中第K大的数字
查看>>
GCC的gcc和g++区别
查看>>
CENTOS 7 和 JDK 添加中文字体
查看>>
tomcat并发优化
查看>>