.keyCodeと.which

これはスタックオーバーフローのどこかで解決されると思いましたが、見つかりません。

キープレスイベントをリッスンしている場合、Enterキーが押されたかどう.keyCodeか.whichを確認するために使用する必要がありますか？

私はいつも次のようなことをしました：

$("#someid").keypress(function(e) {
  if (e.keyCode === 13) {
    e.preventDefault();
    // do something
  }
});

しかし、の.which代わりにを使用する例を見ています.keyCode。違いは何ですか？他のブラウザよりフレンドリーなブラウザがありますか？

注：以下の回答は2010年に書かれています。ここ数年後、keyCodeおよびwhichはkey（論理キーの場合）およびcode（キーの物理的な配置の場合）のために廃止されました。ただし、IEはをサポートしておらずcode、そのサポートkeyは古いバージョンの仕様に基づいているため、正確ではないことに注意してください。私がこれを書いているとき、EdgeHTMLとChakraに基づいた現在のEdge codeもどちらもサポートしていませんが、MicrosoftはBlinkベースとV8ベースのEdgeの置き換えを展開しています。

一部のブラウザはを使用しkeyCode、他のブラウザはwhich。

jQueryを使用している場合はwhich、jQueryが標準化するため、確実に使用できます。詳細はこちら。

jQueryを使用していない場合は、これを行うことができます。

var key = 'which' in e ? e.which : e.keyCode;

または代わりに：

var key = e.which || e.keyCode || 0;

...可能性のある可能性を処理しe.whichます0（JavaScriptの奇妙に強力な演算子0を使用して、最後にそれを復元します||）。

jQuery は、またはがブラウザーでサポートされているevent.whichかどうかevent.whichに応じて正規化します。event.keyCodeevent.charCode

// Add which for key events
if ( event.which == null && (event.charCode != null || event.keyCode != null) ) {
   event.which = event.charCode != null ? event.charCode : event.keyCode;
}

の追加の利点.whichは、jQueryがマウスクリックに対しても実行できることです。

// Add which for click: 1 === left; 2 === middle; 3 === right
// Note: button is not normalized, so don't use it
if ( !event.which && event.button !== undefined ) {
    event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) ));
}

バニラJavascriptを使用している場合は、keyCodeが廃止され、削除されることに注意してください。

この機能はWeb標準から削除されました。一部のブラウザではまだサポートされている可能性がありますが、削除される予定です。使用を避け、可能であれば既存のコードを更新してください。このページの下部にある互換性の表を参照して、判断を下してください。この機能はいつでも動作しなくなる可能性があることに注意してください

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode

代わりに、必要な動作に応じて.keyまたは.codeのいずれかを使用してください：https : //developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code https://developer.mozilla.org/en -US / docs / Web / API / KeyboardEvent / key

どちらも最新のブラウザに実装されています。

これを見てください：https : //developer.mozilla.org/en-US/docs/Web/API/event.keyCode

keypressイベントでは、押されたキーのUnicode値は、keyCodeまたはcharCodeプロパティのいずれかに格納されます。両方には格納されません。押されたキーが文字（「a」など）を生成する場合、charCodeは、大文字と小文字を区別して、その文字のコードに設定されます。（charCodeは、Shiftキーが押されているかどうかを考慮します）。それ以外の場合、押されたキーのコードはkeyCodeに格納されます。keyCodeは常にkeydownイベントとkeyupイベントで設定されます。これらの場合、charCodeは設定されません。keyCodeに格納されているかcharCodeに格納されているかに関係なく、キーのコードを取得するには、whichプロパティをクエリします。IMEを介して入力された文字は、keyCodeまたはcharCodeを介して登録されません。

私はevent.key現在お勧めします。MDNドキュメント：https : //developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

event.KeyCodeまた、event.whichどちらのMDNページの上部にも、非推奨の厄介な警告があり
ます 。https：//developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode https://developer.mozilla.org/en-US / docs / Web / API / KeyboardEvent / which

英数字キーの場合、event.keyすべてのブラウザで同じように実装されているようです。コントロールキー（タブ、エンター、エスケープなど）の場合、event.key Chrome / FF / Safari / Opera全体で同じ値ですが、IE10 / 11 / Edgeでは値が異なります（IEは仕様の古いバージョンを使用しているようですが、互いに一致しています。 2018年1月14日）。

英数字キーの場合、チェックは次のようになります。

event.key === 'a'

制御文字については、次のようにする必要があります。

event.key === 'Esc' || event.key === 'Escape'

私はここの例を使用して複数のブラウザーでテストしました（IE10で動作させるには、コードペンで開いて編集する必要がありました）：https ://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/ コード

event.code 可能性として別の答えで言及されていますが、IE10 / 11 / Edgeはそれを実装していません。そのため、IEサポートが必要かどうかはわかりません。

キーボード入力と入力されたキーの組み合わせをキャプチャするための堅牢なJavascriptライブラリ。依存関係はありません。

http://jaywcjlove.github.io/hotkeys/

hotkeys('ctrl+a,ctrl+b,r,f', function(event,handler){
    switch(handler.key){
        case "ctrl+a":alert('you pressed ctrl+a!');break;
        case "ctrl+b":alert('you pressed ctrl+b!');break;
        case "r":alert('you pressed r!');break;
        case "f":alert('you pressed f!');break;
    }
});

：ホットキーは以下の修飾子を理解し⇧、shift、option、⌥、alt、ctrl、control、command、と⌘。

次の特殊キーがショートカットに使用することができます：backspace、tab、clear、enter、return、esc、escape、space、up、down、left、right、home、end、pageup、pagedown、del、deleteとf1てf19。

Firefoxでは、keyCodeプロパティはonkeypressイベントでは機能しません（0のみを返します）。クロスブラウザーソリューションの場合、keyCodeと共にwhichプロパティを使用します。例：

var x = event.which || event.keyCode;  // Use either which or keyCode, depending on browser support