方式一
wxml 片段
<view class="{{longPressTag==index?'long-press-status':''}}
wx:for="{{searchHistory}}" wx:key="index" data-index="{{index}}"
catchtap="onTouch"
bindlongpress="longPress">
{{item}}
</view>
js 片段
Page({
onTouch: function(e) {
//標(biāo)簽單擊事件邏輯
},
longPress: function(e) {
//標(biāo)簽長(zhǎng)按事件邏輯
}
})
解析
-
tap
觸摸事件采用catch
阻止事件冒泡 - 1.5.0之后支持
longpress
事件,手指觸摸后,超過350ms再離開,如果指定了事件回調(diào)函數(shù)并觸發(fā)了這個(gè)事件,tap事件將不被觸發(fā)
方式二(不推薦)
-
longtap
事件,但在觸發(fā)時(shí)會(huì)同時(shí)觸發(fā)單擊事件,需配合touchstart
和touchend
事件計(jì)算觸屏開始和結(jié)束時(shí)間來使用
wxml
<view class="{{longPressTag==index?'long-press-status':''}}
wx:for="{{searchHistory}}" wx:key="index" data-index="{{index}}"
catchtap="onTouch"
bindlongtap="longPress"
bindtouchstart="touchStart"
bindtouchend="touchEnd">
{{item}}
</view>
js
Page({
touchStart: function (e) { //記錄觸屏開始時(shí)間
this.setData({start:e.timeStamp })
},
touchEnd: function (e) { //記錄觸屏結(jié)束時(shí)間
this.setData({end: e.timeStamp })
},
longPress: function(e) { //長(zhǎng)按事件邏輯
},
onTouch:function(e) {
if (this.data.end - this.data.start < 350){
//單擊事件邏輯
}
}
})
文章來源地址http://www.zghlxwxcb.cn/news/detail-517514.html
文章來源:http://www.zghlxwxcb.cn/news/detail-517514.html
到了這里,關(guān)于微信小程序長(zhǎng)按與單擊事件觸發(fā)的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!