當(dāng)前位置:
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
原生JS【fiveKeyPress】2秒内五次点击键盘任意键(或组合键)触发自定义事件(以Pause/Break键为例)
生活随笔
收集整理的這篇文章主要介紹了
原生JS【fiveKeyPress】2秒内五次点击键盘任意键(或组合键)触发自定义事件(以Pause/Break键为例)
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
看文章之前來(lái)一個(gè)熱身吧[JavaScript鍵碼表]身為一個(gè)鍵盤(pán)俠,不搞清楚鍵碼映射表怎么可以???_你摯愛(ài)的強(qiáng)哥(http://www.shuzhiqiang.com)-CSDN博客keycode 0 =keycode 1 =keycode 2 =keycode 3 =keycode 4 =keycode 5 =keycode 6 =keycode 7 =keycode 8 = BackSpacekeycode 9 = Tabkeycode 10 =keycode 11 =keycode 12 = Clearkeycode 13 = Enterkeycode 14 =keycode 15 =keycode 16 = Shift_Lkeycode 17.https://blog.csdn.net/qq_37860634/article/details/120446294
<!doctype html> <html lang="en"> <head><meta charset="UTF-8"> </head> <body> </body> <script>let multiKeyPress = {keyPressTimes: 0,// 2秒內(nèi)5連擊(默認(rèn))________________________trigger(multiKeyPressCallback,singleClickCallback,maxTimes = 5,time = 2000) {this.keyPressTimes || (this.keyPressTimes = 0);++this.keyPressTimes >= maxTimes &&(multiKeyPressCallback && multiKeyPressCallback(),singleClickCallback || (this.keyPressTimes = 0));this.keyPressTimes === 1 &&setTimeout(() => {this.keyPressTimes < maxTimes &&singleClickCallback &&singleClickCallback(); //執(zhí)行單擊鍵盤(pán)or少于maxTimes次數(shù)的點(diǎn)擊this.keyPressTimes = 0;}, time);}};/*設(shè)置快捷鍵*/onkeyup = e => {if (e.key === 'Pause') {/*按下Pause/Break鍵時(shí)候執(zhí)行*/multiKeyPress.trigger(() => {// 雙擊鍵盤(pán)alert(`【更新時(shí)間】${versionTime}\n(注意校對(duì)是否已發(fā)布最新代碼)`);},() => {// 單擊鍵盤(pán)console.count();console.log("單擊Pause/Break鍵");}, 2, 300);}};let versionTime='2021年01月01日 00:00:00'; </script> </html>總結(jié)
以上是生活随笔為你收集整理的原生JS【fiveKeyPress】2秒内五次点击键盘任意键(或组合键)触发自定义事件(以Pause/Break键为例)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 腾讯阿里的螺丝钉,一样会生锈!
- 下一篇: 跟风“涨价”,品牌老化,为何“0糖”的奥