キーを押して放したことを検知したい
をシンプルにしたくて書きました
- キーを押したら
テキストエリアにそのキーコードを入れる
- キーを放したら
テキストエリアからそのキーコードを消す
ここで対象にするキーは以下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>
|