キーを押して放したことを検知したい
をシンプルにしたくて書きました
- キーを押したら
テキストエリアにそのキーコードを入れる
- キーを放したら
テキストエリアからそのキーコードを消す
ここで対象にするキーは以下4つの装飾キーです
“command”: 91
“shift”: 16
“control”: 17
“option”: 18
デモ
コード.gs
function doGet() { return HtmlService.createHtmlOutputFromFile("index"); } |
意訳この機能がやること 指定したHTMLファイルを表示する |
index.html
<!DOCTYPE html> <html> <body> <textarea id="key_down_ta" disabled></textarea> <script> /************************************ グローバル ************************************/ var key_down_ta = elem("key_down_ta"); /************************************ イベント ************************************/ document.onkeydown = function(e) { down_up_keycode(e, "down") }; document.onkeyup = function(e) { down_up_keycode(e, "up") }; /************************************ elem(id) ************************************/ function elem(id) { return document.getElementById(id); } /************************************ 装飾キー “command”: 91 “shift”: 16 “control”: 17 “option”: 18 ************************************/ var modifier_key = /91|16|17|18/; /************************************ down_up_keycode ************************************/ function down_up_keycode(e, flag) { var keycode = get_keycode(e); var is_modifier_key = modifier_key.test(keycode.toString()); if (is_modifier_key === true) { var down_value = key_down_ta.value; switch (flag) { case "down": key_down_ta.value = ""; key_down_ta.value += down_value + keycode + ","; break; case "up": var result = down_value.replace(keycode + ",", ""); key_down_ta.value = result; break; } } } /************************************ get_keycode ************************************/ function get_keycode(e) { var keycode = e.keyCode; return keycode; } </script> </body> </html> |