【K】Keyboardで装飾キーの押下を取得(Win/Mac対応)
この記事は、ADVENTAR 『"Alphabet reg." Web develop Advent Calendar 2023』 10日目の記事です。
/icons/hr.icon
取得するぶんには普通にそのへんにEventListenerを張っておけばいいんですけど
code:script.js
document.body.addEventListener("keyup", event => {
console.log(event.code); // event.code(かevent.key)を使おう!
});
問題は修飾(Shift, Ctrl, Alt)です、こいつはWindowsとMac両方のことを考えないといけない
WindowsとMacでどのキーが上4つに対応するかが異なります。
table:対応表
Windows Mac
altKey Alt ⌥ option
ctrlKey Ctrl ⌃ control
metaKey (※1) ⌘ command
shiftKey Shift ⇧ shift
※1 : 昔はWindowsキーが反応していたが、今はWindowsキーは捕捉できない模様。
現実的な解決策はctrlKey || metaKeyだと思います。UAで切り替えるとかだるいもんね