你我学习网
前言
对于同一控件同时设置
bindtap和bindlongtap,会发现长按时先出现bindlongtap的事件，然后触发点击事件，显然这不是我们想要的。
下面是个已实现功能的实例，请根据业务逻辑进行修改。
wxml
1 2 3 4 5 6 7 8 | <!-- 此处更换为你的触发组件 --><button bindtouchstart="handleTouchStart" bindtouchend="handleTouchEnd" bindlongpress="handleLongPress" bindtap="handleClick">点击或长按</button> |
js
主要根据用户手指触摸时间和屏蔽手指触摸开始与结束来实现是点击还是长按操作。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | Page({ data: {}, /* * 事件处理 */ // 点击事件 handleClick: function(e) { //如果长按时间小于350则证明是用户进行点击 if (this.endTime - this.startTime < 350) { console.log("点击"); } }, // 长按事件 handleLongPress: function(e) { console.log("长按"); }, // @手指触摸开始(不会触发) // @请勿删除代码 handleTouchStart: function(e) { this.startTime = e.timeStamp; }, // @手指触摸结束(不会触发) // @请勿删除代码 handleTouchEnd: function(e) { this.endTime = e.timeStamp; },}) |
