6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

JavaScriptでキーイベントを発生させる!【jQuery】

Posted at

 JavaScriptでキーイベントを発生させる方法です。

キーイベントとは、JavaScriptでキーボードからの入力を受け取ることができるオブジェクトで、PCのキーとイベント処理を連動させたい時などに使われます。

例えば

・ここのキーを押したら音が鳴る
・ここのキーを押したら文字が変わる

などと行った処理が可能になります。

キーイベントの種類は以下のようなものがあります。

keydown (キーが最初に押されたときに発生)
keyup (キーが装飾キーでなかったときに発生)
keyup (キーを離したときに発生)

キーイベントを発生させる、実際のコードの初歩的な書き方がこちらです。

$(selector).on("keydown",function(e){
              //処理
});

そして、キーイベントのコードの例はこちらです。

$(window).on("keyup", function(e){
       if(e.keyCode == 78){
           audio.play(); }
});

こちらは「J」のキーを押したら特定の音が出る仕組みになっています。

keyCodeというのは、各キーに番号が割り振られていて、その番号を用いてキーを指定します。
各キーのキーコードはこちらで簡単に調べることが可能です。

JavaScriptでゲームを作成する時など、PCのキーと連動させることで遊びの幅が広がりそうですね!

記事を執筆するにあたって、今回こちらの記事を参考にさせていただきました。

6
2
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?