【javaScript・jQuery】キーイベントで押されたキーを取得する

2019年7月18日

キー操作のイベントで押されたキーを取得する方法を紹介します。

押されたキーを取得するには「keydown」のイベント内で「event.key」を使います。
※「event.keyCode」は廃止されたようなので注意

[サンプル]



ソースコードを紹介します。
[index.html]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div><input id="input-text" type="text" placeholder="ここでキーを打つ" /></div>
<script src="index.js"></script>

[index.js]

/**
* 初期化処理
*/
$(function () {
    // 要素にkeydownイベントを付与
    $("#input-text").on("keydown", function (event) {
        // 引数から押されたキーを取得
        alert(event.key);
    });
});

スポンサーリンク