숫자 키패드의 keyCode 값?

숫자 키패드의 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;
        . . . 

문제는 이 코드가 키보드 상단에 입력된 숫자에만 반응하여 실행되고 숫자 키패드에서 입력된 숫자에는 반응하지 않는다는 것입니다.

숫자 키패드의 keyCode 값이 다르다는 것이 정답일 것이라고 생각합니다만, 그것들이 무엇인지 어떻게 알 수 있습니까?

키 코드가 다릅니다.키패드 0-9는 키코드입니다.96로.105

당신의.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
}

이벤트를 위한 출력 테스터입니다.키, 링크에 대해 @Danziger에게 감사드립니다.

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

간단히 실행할 수 있습니다.

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

브라우저 콘솔에서 누른 키의 코드를 확인합니다.

또는 https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode#Numpad_keys 에서 주요 코드를 찾을 수 있습니다.

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

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

그것은 첫 번째 답의 논리를 사용합니다.

다른 답변 중 일부를 추가하려면 다음 사항에 유의하십시오.

• keyup그리고.keydown 와 다른keypress
• 사용하고 싶은 경우String.fromCharCode()에서 실제 숫자를 얻다keyup저정상야합니다를 .keyCode.

아래는 키가 숫자인지 여부와 키 번호를 결정하는 자체 문서화 예제입니다(예: 의 함수 사용).

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

예, 그들은 서로 다르며 많은 사람들이 console.log를 사용하여 직접 볼 것을 제안했습니다.하는 데 할 수 event 못했습니다.event.location === 3기본 키보드/일반 키의 맨 위와 비교event.location === 0으로 키 해야 할 때 합니다.event.key특정 키에 더 적합할 수 있습니다.

키 코드 페이지를 사용하여 다음을 찾을 수 있습니다.

이벤트 코드

숫자 키보드의 차이를 표시합니다.

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

문서에는 onkeyxxx 이벤트와 관련된 이벤트 순서가 나와 있습니다.

1. 키다운으로
2. 건반으로
3. 보조를 맞추어

아래 코드와 같이 사용하면 백스페이스에도 맞고 사용자 상호작용을 입력합니다.키프레스 또는 키업 이벤트에서 원하는 작업을 수행할 수 있는 후.코드 블록 트리거 event.provent기본값 값이 숫자, 백스페이스 또는 입력이 아닌 경우.

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

@.A.의 답변.또한 설치 공간이 작고 이해하기 쉬운 최고의 솔루션이라는 것을 알게 되었습니다.만약 당신이 더 적은 코드 양을 원한다면 위에 추가하고 싶을 뿐입니다. 모렐의 수정인 이 솔루션은 악명 높은 'e' 문자를 포함한 어떤 종류의 문자도 허용하지 않는 데 잘 작동합니다.

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

@A 조금 클리어 되었습니다.모렐의 대답.키보드 언어 레이아웃에 주의할 수 있습니다.일부 키보드 레이아웃은 기본 숫자 키를 기호로 변경했습니다.

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

은 인이필니다를 확인해야 .event.key0 됩니다.에서 9 사이의 숫자로 변환됩니다.는 0-9 범위 배열을 범위 배열로 수 .Array.from(Array(10).keys())그리고 확인합니다.event.key이 범위에 있는지 여부.

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

이를 통해 keyCodes를 쉽게 파악할 수 있습니다.

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

http://jsfiddle.net/vecvc4fr/

언급URL : https://stackoverflow.com/questions/13196945/keycode-values-for-numeric-keypad