原生js实现【longPressKey】长按键盘任意键（或组合键）3秒触发自定义事件（以Pause/Break键为例）
生活随笔
收集整理的這篇文章主要介紹了
原生js实现【longPressKey】长按键盘任意键（或组合键）3秒触发自定义事件（以Pause/Break键为例）
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
<!doctype html>
<html lang="en">
<head><meta charset="UTF-8">
</head>
<body>
</body>
<script>let longPressKey = {
timeout: null,
trigger(pressedEndCallback, //長(zhǎng)按結(jié)束觸發(fā)方法pressedStartCallback, //按下觸發(fā)方法pressedUpCallback, //彈起觸發(fā)方法key = 'Pause', //長(zhǎng)按什么鍵delaySecond = 3 //長(zhǎng)按多少秒觸發(fā)
) {onkeydown = (e) => {let k = e.keyCode || e.which || e.charCode,ck = e.ctrlKey || e.metaKey,ak = e.altKey,sk = e.shiftKey;if (e.key === key) {if (!this.timeout) {pressedStartCallback && pressedStartCallback(e);this.timeout = setTimeout(() => {this.timeout = null;pressedEndCallback && pressedEndCallback(e);}, 1000 * delaySecond);}}};onkeyup = (e) => {clearTimeout(this.timeout);this.timeout = null;pressedUpCallback && pressedUpCallback(e);};
},
};//測(cè)試用例----------------------------------------
let versionTime = '2022年2月6日 17:43:12';
longPressKey.trigger(
(e) => {// 長(zhǎng)按超時(shí)執(zhí)行alert(`【更新時(shí)間】${versionTime}\n（注意校對(duì)是否已發(fā)布最新代碼）`);
},
(e) => {// 剛剛按下鍵console.log("按鍵對(duì)象",e);
},
(e) => {// 彈起console.log("彈起鍵對(duì)象",e);
},
'Pause',
3
);</script>
</html>
總結(jié)
以上是生活随笔為你收集整理的原生js实现【longPressKey】长按键盘任意键（或组合键）3秒触发自定义事件（以Pause/Break键为例）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 一个熟练程序员所具备的特质-2
- 下一篇： 下载安装腾讯会议