原生js如何判斷移動(dòng)端的tap,dbltap,longtap?點(diǎn)擊,雙擊,長(zhǎng)按的識(shí)別

在移動(dòng)端,可以根據(jù)touchStart與touchEnd的間隔來(lái)判斷是點(diǎn)擊,雙擊,還是長(zhǎng)按;

主要的代碼:

let t=0, lastTap=0;

oBtn.addEventListener('touchstart',function(){

t=Date.now();

},false);

oBtn.addEventListener('touchend',function(){

if(Date.now()-t<=700){

console.log('tap');

if(Date.now()-t<=700){

????console.log('tap');

if(Date.now()-lastTap<=300){

????console.log('dbltap');

}

lastTap=Date.now();

}else{

console.log('long tap');

}

lastTap=Date.now();

}

},false);

通過(guò)時(shí)間差來(lái)判斷,當(dāng)然為什么是700, 300,是我的經(jīng)驗(yàn)值,在開(kāi)發(fā)中覺(jué)得這二個(gè)值的界定還是挺合適的。一次雙擊同時(shí)等于二次單擊。當(dāng)然手機(jī)上面雙擊的交互是很少的,長(zhǎng)按還是挺有實(shí)用性的,比如長(zhǎng)按刪除。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • zepto的tap事件點(diǎn)透問(wèn)題分析: 一、點(diǎn)透是什么 你可能碰到過(guò)在列表頁(yè)面上創(chuàng)建一個(gè)彈出層,彈出層有個(gè)關(guān)閉的按鈕...
    夏沉閱讀 2,462評(píng)論 2 1
  • 一、設(shè)備事件 移動(dòng)端事件都要在head里面設(shè)置: 獲取移動(dòng)端設(shè)備的尺寸:screen.width,screen.h...
    空谷悠閱讀 295評(píng)論 2 3
  • js簡(jiǎn)介 Js是一種基于事件和對(duì)象驅(qū)動(dòng)的解釋性、松散性的語(yǔ)言。 一切皆對(duì)象 javascript 布蘭登艾奇 ...
    塔庫(kù)納瑪哈哈閱讀 1,349評(píng)論 0 2
  • 每當(dāng)有人問(wèn)我為什么還沒(méi)有戀愛(ài)時(shí),我都在心里說(shuō),因?yàn)槲以诘饶莻€(gè)對(duì)的人,也在等自己變得足夠優(yōu)秀。 上大學(xué)之后,遇到了一...
    木木青南閱讀 387評(píng)論 0 3
  • 既被糾結(jié)了心跳,又被掌控了微笑,怎么樣都是輸了吧。就這樣吧,能在一起相親相愛(ài)多久就多久吧,永遠(yuǎn)永遠(yuǎn)都不要離開(kāi),我是...
    憂郁的漁閱讀 230評(píng)論 0 0

友情鏈接更多精彩內(nèi)容