.keyCode vs. .which

Question

これはStack Overflowのどこかで答えられると思っていましたが、見つけられませんでした。

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

私は常に次のようなものやった：

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

をしかし、私は.whichの代わり.keyCode使用例を見ています。違いは何ですか？他のブラウザよりもクロスブラウザの方がフレンドリーですか？

Answer 1

一部のブラウザはkeyCodeを使用し、その他のブラウザはwhichを使用します。 jQueryを使用している場合は、whichをjQuery standardizes thingsとして確実に使用できます。あなたはjQueryのを使用していない場合More here.

---

、あなたはこれを行うことができます。交互

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

または：e.whichがあるかもしれないという可能性を扱う

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

を... 0 （最後に0を復元することによって、JavaScript's curiously-powerful || operatorを使用して）。

Answer 2

jQueryのevent.which、event.keyCodeまたはevent.charCodeがブラウザでサポートされているかどうかに応じて、event.which正常化：

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

Anは.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))); 
} 

Answer 3

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

キー入力イベントでは、押されたキーのUnicode値はkeyCodeまたはcharCodeプロパティのいずれかに格納されます。押されたキーが文字（例えば 'a'）を生成した場合、charCodeはその文字の大文字と小文字を区別してコードに設定されます。 （すなわち、charCodeは、シフトキーが押されているかどうかを考慮する）。それ以外の場合は、押されたキーのコードがkeyCodeに格納されます。 keycodeは常にkeydownイベントとkeyupイベントで設定されます。このような場合、charCodeは設定されません。 keyCodeまたはcharCodeに格納されているかどうかにかかわらず、キーのコードを取得するには、whichプロパティを照会します。 IMEによって入力された文字は、keyCodeまたはcharCodeで登録されません。

Answer 4

入力されたキーボード入力とキーの組み合わせをキャプチャするための強力なJavascriptライブラリ。依存関係はありません。 ⇧、shift、option、⌥、alt、ctrl、control、command、そして⌘：

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; 
    } 
}); 

ホットキーは、以下の修飾子を理解します。

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

Answer 5

あなたはバニラJavaScriptで滞在している場合は、キーコードを注意してください廃止され、ドロップされます。

この機能は、Web標準から削除されました。いくつかのブラウザはまだそれをサポートしているかもしれませんが、それは落とされつつあります。可能であれば、それを使用したり、既存のコードを更新したりしないでください。このページの下部にある互換性表を参照して決定を導きます。あなたが望む行動に応じて、.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/KeyboardEvent/keyCode

のいずれかを使用で仕事をやめることに注意してください

両方とも最新のブラウザに実装されています。

Answer 6

現在、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 === 'Esc' || event.key === 'Escape' 

：制御文字について

event.key === 'a' 

が好きなあなたは何かをする必要があると思います（私はcodepenで開き、IE10で動作するように編集しなければならなかった）：https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code

event.codeは別の答えでa IE10/11/Edgeはそれを実装していないので、IEのサポートが必要な場合は外に出ます。