javascript mousetrapを使用してブラウザ上でのキー入力を検知する
- 2020.07.20
- javascript
- mousetrap
javascriptのライブラリである「mousetrap」を使用してブラウザ上でのキー入力を検知するサンプルコードとなります。
環境
- OS windows10 pro 64bit
mousetrap使用例
下記のコードはmousetrapを利用したサンプルコードとなります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>タイトル</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.6.5/mousetrap.min.js"></script> </head> <body> <script> Mousetrap.bind('esc', function() { alert('escapeが押下されました'); }); Mousetrap.bind('shift+a', function(){ alert("shift+a が押下されました"); }); Mousetrap.bind('ctrl+q', function () { alert('ctrl+q が押下されました'); }); </script> </body> </html> |
実行結果の通り、mousetrapを利用するとキー入力のイベントを簡単に取得することが可能となります。
-
前の記事
dockerを使ってオンラインストレージ「Pydio Cells」をインストールする 2020.07.20
-
次の記事
java 「Apache Commons Lang」の「StringUtils」を利用してnullと空文字チェックを行う 2020.07.20