チャットなどを作るときに、"Shift+Enterキーを押したときに送信を行う"などをよく使うと思います。このときのキーの同時押しの処理がイマイチ情報を調べにくかったのでまとめておきます。
やりたいこと
Shift + Enterを押した時に何か
調査
１つのキーコード取得
jQueryのkeydownメソッドを使うと凄く簡単に１つのキーなら取得できました。
keydown(fn) - jQuery 日本語リファレンス
複数のキーコード取得
基本的には１つのキーコードを取得してそれが押された状態で次のキーが押されたという判定をkeyup,keydownを使って取得するみたいです。
JavascriptでKeyの同時押しを判定する
．．．けっこうめんどくさそうでした。
(てかキーコードいちいち調べるのも面倒)
altKeyとかmetaKeyとかのイベントがあるっぽい
教えてもらったのですが、altキーやcontrolキーなどのキーに関しては専用のイベントがあるみたいです。jQueryは使ってないけどドンピシャなサンプルがこちら。ピュアなJSならこっちのサンプルの方がいいかも
CTRLキーなど特殊キーが押されたかを調べる
完成コード
get_multipule_key_event.js
$(function($){
//Ctrlキー+エンター
$(window).keydown(function(e){
if(event.ctrlKey){
if(e.keyCode === 13){
alert("ctrl+enter");
return false;
}
}
});
//Shiftキー+エンター ←今回のやりたかったこと
$(window).keydown(function(e){
if(event.shiftKey){
if(e.keyCode === 13){
alert("shift+enter");
return false;
}
}
});
});
return false;を入れないとキーコード押したあとに改行(Enter)が実行されちゃうのでチャットなどの送信に使う場合は書いておきましょう。
まとめ
他にも.altKeyやmetaKeyなどもあるのでこれらを使えば同時押し制御もしやすくなるんじゃないかな。
KeyboardEvent - DOM | MDN