Разбор кода клавиатуры Javascript

Я пытаюсь разобрать события нажатия клавиш с цифровой клавиатуры следующим образом:

$('#myDiv').keydown(function(e) {
  val = String.fromCharCode(e.which)
});

Проблема в том, что клавиатура 0-9 возвращает коды клавиш 96-105, которые, согласно fromCharCode(), являются строчными буквами a-i. Как получить события нажатия клавиш на цифровой клавиатуре для разрешения на соответствующий номер?


person Lee Quarella    schedule 19.02.2012    source источник


Ответы (5)


Вы этого не сделаете: вы используете событие keypress. Событие keypress — это единственное событие, которое даст вам достоверную информацию о введенных символах. Ваш существующий код будет работать, если вы просто измените keydown на keypress.

person Tim Down    schedule 19.02.2012
comment
Предположим, мне нужны настоящие символы с клавиатуры, а также я хочу захватить и остановить клавишу Enter, чтобы предотвратить отправку формы? Остановка нажатия клавиши, кажется, все еще отправляется. - person enigment; 31.08.2012
comment
Я не могу выразить, насколько я благодарен за этот ответ. Это было моим спасением, когда я пытался поймать все возможные случаи с Shift, Alt, цифровой клавиатурой и мобильными клавиатурами. keypress это легко! - person nirazul; 29.05.2013

Значение which, переданное в keydown, не является кодом символа; это ключевой код (и коды различаются от браузера/ОС к браузеру/ОС). Вы можете сопоставить его с символом, используя таблицы на этой странице, но сказать, что это немного... неловко... было бы преуменьшением дела. :-)

В противном случае лучше всего дождаться события keypress, которое будет иметь код символа (если применимо), а не код клавиши.

Пример: Динамическая копия | Текущий источник

jQuery(function($) {

  $("#theField")
    .keydown(function(event) {
      showKey("keydown", event.which);
    })
    .keypress(function(event) {
      showKey("keypress", event.which);
    })
    .focus();

  function showKey(eventName, which) {
    display(eventName +
            ": " + which + " (" +
            String.fromCharCode(which) + ")");
  }

  function display(msg) {
    $("<p>").html(msg).appendTo(document.body);
  }
});

Используя этот HTML:

<input type="text" id="theField">
person T.J. Crowder    schedule 19.02.2012

Ответы здесь устарели, потому что KeyboardEvent.what , KeyboardEvent.keyCode и KeyboardEvent.charCode устарели.

Для последних версий Firefox, Chrome, IE/Edge и Safari правильный способ получить ключ символа — использовать KeyboardEvent.key, и он должен работать с любым событием клавиши, а не только с keypress.

Совместимость KeyboardEvent.key с браузером

document.
  querySelector('input').
  addEventListener('keydown', event => console.log(event.key));
<input placeholder="Start typing...">


Если вам все же нужно получить код символа, используйте Свойство KeyboardEvent.code.

Совместимость KeyboardEvent.code с браузером

document.
  querySelector('input').
  addEventListener('keydown', event => console.log(event.code));
<input placeholder="Start typing...">

person nem035    schedule 29.11.2016

Есть способ сделать это с помощью нажатия клавиши, если нажатие клавиши не работает из-за необходимости отмены события и т. д. Используйте оператор if() с этим тестом:

parseInt(event.keyIdentifier.substring(2),16) > 47 && parseInt(event.keyIdentifier.substring(2),16) < 58

ИЛИ, с событиями jQuery:

parseInt(event.originalEvent.keyIdentifier.substring(2),16) > 47 && parseInt(event.originalEvent.keyIdentifier.substring(2),16) < 58

В этих примерах предполагается, что «событие» — это событие нажатия клавиши. keyIdentifier — это шестнадцатеричное число, представляющее значение Юникода для связанного символа. Используя keyIdentifier, числа с цифровой панели / клавиатуры И числа над вашей QWERTY-клавиатурой будут иметь одинаковые значения, 48–57 (U+0030–U+0039), даже с событием keyDown.

Значения Unicode в браузерах будут выглядеть как U+0030 или U+002F. Проанализируйте эту строку, чтобы получить только шестнадцатеричное значение, а затем используйте функцию parseInt() с основанием 16, чтобы преобразовать ее в основание 10.

person ChrisN    schedule 07.02.2014

вы можете использовать keydown и обнаруживать клавиши цифровой клавиатуры. Я сделал это, используя следующий код. Вычтите 48 из клавиш цифровой клавиатуры, прежде чем интерпретировать клавишу

function navigate(e) {
        var keyCode = e.keyCode || e.which;
        if (keyCode >= 96 && keyCode <= 105) {
            // Numpad keys
            keyCode -= 48;
        }  
        var txtVal = String.fromCharCode(keyCode);
person Sacky San    schedule 21.03.2017