web-dev-qa-db-ja.com

event.keycodeがFirefoxで正しい値を返さない

入力ボックス内でspace-barが押されたときに、jsメソッドをトリガーするために次のコードを試しています。

  <input id="j1" /> 

  $('#j1').keypress (function (event){
       alert(event.keycode)
  });

Firefoxでは、これはenterが押された場合にのみ正しい値を返し、他のキーに返される値は毎回です。 IE/chromeではこれは完全に機能します。

javascriptjqueryeventskeypresskeycode
20
Rajat Gupta

IE以外のブラウザーでは、whichプロパティではなくcharCodeイベントにkeypressまたはkeyCodeプロパティが必要です。 keypressイベントは型付き文字を検出するためのものであり、keyupとkeydownは物理キーを検出するためのものです（これらのイベントでは、keyCodeはすべての主要なブラウザーで機能します）。

var charCode = (typeof event.which == "number") ? event.which : event.keyCode;

ただし、jQueryはこれと同様のコードを使用して、キー押下イベントのwhichプロパティを正規化するため、jQueryでは必要なだけです。

var charCode = event.which;

重要なイベントの（多くの）詳細については、 http://unixpapa.com/js/key.html を参照してください。

25
Tim Down

問題は、すべてのブラウザがキーを押したときに同じ実装を持っているわけではないということです。解決策は、keyが登録されている可能性のあるすべての場所を確認することです。この場合： event.keycodeおよびevent.which

詳細については、この投稿を参照してください

jQueryイベントキープレス：どのキーが押されましたか？

[〜＃〜]編集[〜＃〜]

最後に私の古い関数を掘り起こしました、これは私が使用する実際のコードです：

evt = (evt) ? evt : event;
var charCode = evt.which || evt.charCode || evt.keyCode || 0;
7
Rolando Cruz

"event.keyCode"が適切な値を返さない場合、Firefoxの場合は "event.charCode"を使用できます。

var keyValue = event.charCode || event.keyCode;

2
Jasmeen

KeyboardEvent.keyCode：

Keypressイベントの値は、ブラウザによって異なります。 IEおよびGoogle Chrome KeyboardEvent.charCode値を設定します。押されたキーが印刷可能なキーの場合はGeckoが0を設定し、そうでない場合はキーダウンと同じkeyCodeを設定します。またはキーアップイベント

したがって、Firefoxの観点からは、実際には正しい値が返されています。 ドキュメント を参照してください。

keyCode、which、keyIdentifier、およびcharCodeは非推奨になりました

この機能はWeb標準から削除されました。一部のブラウザはまだそれをサポートしているかもしれませんが、それは削除されている途中です。使用を避け、可能であれば既存のコードを更新してください。

keyIdentifierはIEおよびFirefoxでサポートされておらず、OperaおよびChromeから削除されました
WithcharCode as Non-standard

この機能は非標準であり、標準化されていません。 Webに面している実稼働サイトでは使用しないでください。すべてのユーザーに対して機能するとは限りません。また、実装間に大きな非互換性がある可能性があります

では、代替案は何ですか？

I.代わりにkeyプロパティを使用します

_readonly attribute DOMString key
_

押されたキーに対応するキー属性値を保持します

例： "a"、 "A"、 "@"、 "％"、 "$"、 "ا"、 "ب"、 "ة"、 "ت"、...、 "١"、 "٢"、 「٣」、「Tab」、「Enter」、すべて「F1」... `

非標準キーを持つInternetExplorer 11を除き、すべての主要なブラウザ（Firefox 52、Chrome 55、Safari 10.1、Opera 46））のサポートを獲得しています。識別子とAltGraphの不正な動作 詳細
それが重要であるか、下位互換性が重要である場合は、次のコードのように特徴検出を使用できます。

keyvalueはkeyCodeまたはwhichプロパティとは異なり、コードではなくキーの名前が含まれていることに注意してください。プログラムに文字のコードが必要な場合は、charCodeAt()を利用できます。単一の印刷可能な文字の場合、値に次のような複数の文字が含まれるキーを処理する場合は、charCodeAt()を使用できます。 ArrowUp 可能性は次のとおりです。特別なキーをテストし、それに応じてアクションを実行します。したがって、キーの値とそれに対応するコードのテーブル_charCodeArr["ArrowUp"]=38_、_charCodeArr["Enter"]=13_、_charCodeArr[Escape]=27_...などを実装してみてください。 キー値 をご覧ください。 =およびそれらの 対応するコード

_if(e.key!=undefined){
        var characterCode = charCodeArr[e.key] || e.key.charCodeAt(0);
    }else{
        /* As @Leonid suggeted   */
        var characterCode = e.which || e.charCode || e.keyCode || 0;
    }
        /* ... code making use of characterCode variable  */  
_

II。codeプロパティを使用することもできます：

_readonly attribute DOMString code
_

押されている物理キーを識別する文字列を保持します。この値は、現在のキーボードレイアウトや修飾子の状態の影響を受けないため、特定のキーは常に同じ値を返します。

これは、keyプロパティと同様の効果があり、QUERTYレイアウトのUSキーボードのボタンWが押された場合の_"keyW"_のような出力があります。同じボタンが別のレイアウト（AZERTY）または別の言語（ヘブライ語）で押された場合、または修飾子（shift）と組み合わされた場合、keyプロパティはそれに応じて変更されますが、codeプロパティは引き続き変更されます。同じ値_"keyW"_これについてもっと ここ 。

codeプロパティはChrome 49、Firefox 52、Safari10.1およびOpera 46でサポートされていますが、InternetExplorerではサポートされていません。

も参照してください：

  1. KeyboardEvent.charCode
  2. KeyboardEvent.keyIdentifier
  3. KeyboardEvent.keyCode
  4. KeyboardEvent.which
  5. KeyboardEvent.key
  6. キープロパティのサポート
  7. KeyboardEvent.code
  8. コードプロパティのサポート
1
user10089632

どのキーを押しても_0_を取得している場合は、charCodeの代わりにkeyCodeを使用してみてください

これは、キーボードのUnicode値を返すためにwhichを使用するEventオブジェクトとは対照的に、charCodeとkeyCodeを使用するKeyboardEventオブジェクトを呼び出しているために発生します。詳細については、KeyboardEventの詳細についてMDN Webドキュメントを参照してください。 https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent

1
mado