1. 程式人生 > >小程式踩坑記——長按與點選事件衝突

小程式踩坑記——長按與點選事件衝突

對於同一控制元件同時設定bindtap和bindlongtap,會發現長按時先出現bindlongtap的事件,然後觸發點選事件。

通過測試,我們發現,小程式中事件執行的順序是
點選:touchstart → touchend → tap
長按 touchstart → longtap → touchend → tap

處理方法:

// wxml
<view bindtouchstart="bindTouchStart" bindtouchend="bindTouchEnd" bindlongtap="bingLongTap" bindtap="bindTap">蹂躪我</
view>
// js
bindTouchStart: function(e) {
    this.startTime = e.timeStamp;
}
bindTouchEnd: function(e) {
    this.endTime = e.timeStamp;
}
bindTap: function(e) {
    if(this.endTime  - this.startTime < 350) {
        console.log("點選")
    }
}
bingLongTap: function(e) {
    console.log("長按");
}

這樣通過時間來判斷,可以一定程度上解決這個問題。

參考了文章《小程式踩坑記——長按與點選事件衝突》