数字键盘的 keyCode 值？

Question

数字键盘上的数字是否与键盘顶部的数字具有不同的键码？

这里是一些应该在 keyup 事件上运行的 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;
        . . .

我的问题是，此代码仅响应在键盘顶部输入的数字而运行，但不响应从数字键盘输入的数字而运行。

我想答案一定是数字键盘有不同的 keyCode 值，但我如何找出这些值？

Answer 1

按键代码不同。键盘 0-9 是按键代码

至

您的

if

陈述应该是：

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

这里有键码参考指南

--更新--

这是一个旧答案，

keyCode

已被弃用。现在有替代方法可以实现此目的，例如使用

key

:

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

这里有一个 event.key 的输出测试器，感谢@Danziger 提供的链接。

Answer 2

******************** 不要使用KEYCODE !!!! **********************

keyCode的问题是为了避免与键盘顶部的数字组合键，我们必须在“Shift”和“Alt”键上添加检查以避免特殊字符，例如e @ & “ { } ...

最简单的解决方案是将 e.key 转换为数字，并检查转换是否给出 NaN！

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

小心如果e.key是null或空格，它会给出0！

Number(5)         // => 5
Number('5')       // => 5
Number(null)      // => 0 
Number(' ')       // => 0
Number('chars')   // => NaN
Number(undefined) // => NaN

Answer 3

你可以简单地运行

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

在浏览器控制台中查看按键代码。

或者您可以在这里找到关键代码：https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode#Numpad_keys

Answer 4

数字键盘上的数字和键盘顶部的数字的 keyCode 不同。

键码：

键盘顶部的数字（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

Answer 5

对于需要 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;
    }

它使用了第一个答案的逻辑。

Answer 6

要添加其他一些答案，请注意：

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

Answer 7

是的，它们是不同的，尽管许多人提出了使用 console.log 亲自查看的好建议。但是，我没有看到任何人提到 event.location，您可以使用它来确定数字是否来自键盘

event.location === 3

与主键盘顶部/通用键

event.location === 0

。当您需要大致确定击键是否来自键盘的某个区域时，此方法最适合，

event.key

对于特定按键可能更好。

Answer 8

您可以使用关键代码页来查找：

事件代码

区分数字键盘。

https://keycode.info/

function getNumberFromKeyEvent(event) {
   if (event.code.indexOf('Numpad') === 0) {
      var number = parseInt(event.code.replace('Numpad', ''), 10);
      if (number >= 0 && number <= 9) {
           // numbers from numeric keyboard
      }
   }
}

Answer 9

文档说了与onkeyxxx事件相关的事件顺序：

按下键
按键
启动

如果您使用如下代码，它也适合退格键并输入用户交互。之后您可以在 onKeyPress 或 onKeyUp 事件中执行您想要的操作。如果值不是数字、退格键或回车，则代码块触发 event.preventDefault 函数。

onInputKeyDown = event => {
    const { keyCode } = event;
    if (
      (keyCode >= 48 && keyCode <= 57) ||
      (keyCode >= 96 && keyCode <= 105) ||
      keyCode === 8 || //Backspace key
      keyCode === 13   //Enter key
    ) {
    } else {
      event.preventDefault();
    }
  };

Answer 10

@.A.的回答我发现 Morel 是最容易理解且占用空间小的解决方案。如果您想要更小的代码量，只是想在上面添加这个解决方案，它是对 Morel 的修改，非常适合不允许输入任何类型的字母，包括输入臭名昭著的“e”字符。

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

Answer 11

稍微澄清了@A.Morel 的答案。您可能要注意键盘语言布局。某些键盘布局将默认数字键更改为符号。

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

Answer 12

您需要检查转换为数字的

event.key

是否在0-9之间。所以我们可以通过

Array.from(Array(10).keys())

创建一个范围数组 0-9 并检查

event.key

是否在这个范围内。

const isNumeric = Array.from(Array(10).keys()).includes(Number(event.key));

Answer 13

**数字键盘的事件键代码值

function digitOnly(event) {
            var key = event.keyCode;
            if (event.key === '!' || event.key === '@' || event.key === '#'
                    || event.key === '$' || event.key === '%'
                    || event.key === '^' || event.key === '&'
                    || event.key === '*' || event.key === '('
                    || event.key === ')' || event.key === '_'
                    || event.key === '-') {
                return false;
            }

            if ((key >= 48 && key <= 57)
                    || (key >= 96 && key <= 105 || key == 8)) {
                return true;
            } else {
                return false;
            }
        };

<div id="phoneDiv">
                <label for="phoneNumberId">Phone<b id="starText">*</b></label> <input
                    id="phoneNumberId" type="tel" name="phoneNumber"
                    placeholder="Enter Phone Number here" maxlength="10" minlength="10"
                    onkeydown="return digitOnly(event)" required>
            </div>

**

Answer 14

您可以使用它轻松找出键码：

$(document).keyup(function(e) {
    // Displays the keycode of the last pressed key in the body
    $(document.body).html(e.keyCode);
});

http://jsfiddle.net/vecvc4fr/

数字键盘的 keyCode 值？

问题描述投票：0回答：14

14个回答

最新问题

数字键盘的 keyCode 值？

问题描述 投票：0回答：14

14个回答

最新问题

问题描述投票：0回答：14