web-dev-qa-db-ja.com

テンキーのkeyCode値？

数字キーパッドの数字には、キーボードの上部の数字とは異なるキーコードがありますか？

以下は、キーアップイベントで実行されるはずのJavaScriptです。ただし、キーコードが48〜57の場合のみです。コードは次のとおりです。

$('#rollNum').keyup(function(e) {
    if(e.keyCode >= 48 && e.keyCode <= 57) { //0-9 only
        var max = 15;
        var textLen = $(this).val().length;
        var textLeft = max - textLen;
        . . .

私の問題は、このコードがキーボードの上部に入力された数字に応じてのみ実行され、数字キーパッドから入力された数字に応じて実行されないことです。

私は答えはテンキーのキーコード値が異なるということでなければならないと思っていますが、どうすればそれらが何であるかを知ることができますか？

javascriptjqueryweb-applicationsnumeric-keypad
63
DanielAttard

キーコードは異なります。キーパッド0-9はキーコード96から105です

ifステートメントは次のようになります。

if ((e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105)) { 
    // 0-9 only
}

キーコードのリファレンスガイド

146
Rory McCrossan

******************* KEYCODEを使用しないでください!!!! *************** ***

keyCodeの問題は、キーボードの上部に数字と組み合わされたキーを避けることです。キーにチェックを追加する必要があります"Shift"および"Alt "e @＆" {} ...などの特殊文字を避けるため.

最も単純な解決策は、e.keyを数値に変換し、変換によってNaN！

let key = Number(e.key)
if (isNaN(key) || e.key===null) {
  console.log("is not numeric")
}
else {
  console.log("is numeric")
}

注意 e.keyがnullの場合、！

Number(5)         // => 5
Number('5')       // => 5
Number(null)      // => 0
Number('chars')   // => NaN
Number(undefined) // => NaN
10
A. Morel

簡単に実行できます

$(document).keyup(function(e) {
    console.log(e.keyCode);
});

ブラウザコンソールで押されたキーのコードを表示します。

または、ここでキーコードを見つけることができます： https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode#Numpad_keys

8
Zhegan

keyCodeは、テンキー上の数字とキーボード上の数字では異なります。

keyCodes：

キーボード上部の数字（0-9）：48-57
テンキー上の数字（0-9）：96-105

JavaScript条件：

if((e.keyCode >= 48 && e.keyCode <=57) || (e.keyCode >= 96 && e.keyCode <=105)) { 
    // entered key is a number
}

すべてのキーコードのリファレンス（デモあり）： http://www.codeforeach.com/javascript/keycode-for-each-key-and-usage-with-demo

2
Prashanth

CTRL + C、CTRL-Vソリューションが必要な場合は、次をご覧ください。

    /**
     * Retrieves the number that was pressed on the keyboard.
     *
     * @param {Event} event The keypress event containing the keyCode.
     * @returns {number|null} a number between 0-9 that was pressed. Returns null if there was no numeric key pressed.
     */
    function getNumberFromKeyEvent(event) {
        if (event.keyCode >= 96 && event.keyCode <= 105) {
            return event.keyCode - 96;
        } else if (event.keyCode >= 48 && event.keyCode <= 57) {
            return event.keyCode - 48;
        }
        return null;
    }

最初の答えのロジックを使用します。

0
Jelle

@ .Aによる答えMorel私は、フットプリントが小さく、理解しやすい最高のソリューションであることがわかりました。より少ないコード量が必要な場合は、モレルの修正であるこのソリューションが、悪名高い「e」文字を含むあらゆる種類の文字を許可しないようにうまく機能します。

function InputTypeNumberDissallowAllCharactersExceptNumeric() {
  let key = Number(inputEvent.key);
  return !isNaN(key);
}
0
L1ghtk3ira

他の回答のいくつかに追加するには、次のことに注意してください。

  • keyupおよびkeydownはkeypressとは異なります
  • String.fromCharCode()を使用してkeyupから実際の数字を取得する場合は、最初にkeyCodeを正規化する必要があります。

以下は、キーが数値であるかどうか、およびキーがどの数値であるかを判断する自己文書化の例です（例では、rangeの lodash関数を使用します ）。

const isKeypad = range(96, 106).includes(keyCode);
const normalizedKeyCode = isKeypad ? keyCode - 48 : keyCode;
const isDigit = range(48, 58).includes(normalizedKeyCode);
const digit = String.fromCharCode(normalizedKeyCode);
0
jabacchetta