Enterキーでsubmit/検索/等の処理を行う方法AICS

jQueryを使ってEnterキーを押した時の動作を設定する方法について紹介します．

jQueryではkeypressで押されたキーを取得できます．

この情報(キーイベント)はフォーカスの当たっていた要素からその親の要素へと順々に渡っていきます．

そのため、ページのどの場所かに関係なくEnterキーを押したことを以下のコードで検知できます．

var KEY_CODE_ENTER = 13;

$('body').keypress(function(keyevent) {
  if (keyevent.which === KEY_CODE_ENTER) {
    // Enterキーを押した時の動作
  }
});

var KEY_CODE_ENTER = 13;

$('body').keypress(function(keyevent) {

if (keyevent.which === KEY_CODE_ENTER) {

// Enterキーを押した時の動作

}

});

特定の要素(テキストボックスなど)でのみEnterキーの入力を受け付けたい場合は、その要素にのみbindするようにしてください．

var KEY_CODE_ENTER = 13;

$('#targetInput').keypress(function(keyevent) {
  if (keyevent.which === KEY_CODE_ENTER) {
    // Enterキーを押した時の動作
  }
});

var KEY_CODE_ENTER = 13;

$('#targetInput').keypress(function(keyevent) {

if (keyevent.which === KEY_CODE_ENTER) {

// Enterキーを押した時の動作

}

});

keyevent.whichでキーコードが取得できるので、Enter以外のキー入力を受け付けることもできます．

AICS