KeyboardEvent Value (keyCodes, metaKey и т. Д.) - CSS-хитрости

При KeyboardEventсрабатывании вы можете проверить, какая клавиша была нажата, потому что это событие содержит информацию, для которой вы можете написать логику.

document.addEventListener("keydown", function(event) ( console.log(event.which); ))

Например, нажав «а», вы получите 65. По-видимому, лучше написать логику, против которой, поскольку keyCode и charCode сложны:

Свойство event.which нормализует event.keyCode и event.charCode. Рекомендуется смотреть event.which для ввода с клавиатуры.

И:

В событии нажатия клавиши значение Unicode нажатой клавиши сохраняется либо в свойстве keyCode, либо в свойстве charCode, но никогда в обоих. Если нажатая клавиша генерирует символ (например, 'a'), charCode устанавливается на код этого символа с учетом регистра букв. (т.е. charCode учитывает, удерживается ли клавиша Shift). В противном случае код нажатой клавиши сохраняется в keyCode.

Инструмент тестера

См. Тестер Pen event.keyCode Криса Койера (@chriscoyier) на CodePen.

Значения ключевого кода

Вот таблица, содержащая значения из event.which.

Ключ Код Backspace 8 вкладка 9 войти 13 сдвиг 16 ctrl 17 альт 18 пауза / перерыв 19 Caps Lock 20 побег 27 (Космос) 32 страница вверх 33 листать вниз 34 конец 35 год дома 36 стрелка влево 37 стрелка вверх 38 правая стрелка 39 Кнопка "Стрелка вниз 40 вставлять 45 Удалить 46 0 48 1 49 2 50 3 51 4 52 5 53 6 54 7 55 8 56 9 57 а 65 б 66 c 67 d 68

Ключ Код е 69 ж 70 грамм 71 час 72 я 73 j 74 k 75 л 76 м 77 п 78 о 79 п 80 q 81 год р 82 s 83 т 84 ты 85 v 86 ш 87 Икс 88 у 89 z 90 клавиша левого окна 91 клавиша правого окна 92 выберите ключ 93 цифровая клавиатура 0 96 цифровая клавиатура 1 97 цифровая клавиатура 2 98 цифровая клавиатура 3 99 цифровая клавиатура 4 100 цифровая клавиатура 5 101 цифровая клавиатура 6 102 цифровая клавиатура 7 103

Ключ Код цифровая клавиатура 8 104 цифровая клавиатура 9 105 умножать 106 Добавить 107 вычесть 109 десятичная точка 110 разделять 111 f1 112 f2 113 f3 114 f4 115 f5 116 f6 117 f7 118 f8 119 f9 120 f10 121 f11 122 f12 123 числовой замок 144 блокировка прокрутки 145 точка с запятой 186 знак равенства 187 запятая 188 бросаться 189 период 190 косая черта 191 серьезный акцент 192 открытая скобка 219 обратная косая черта 220 закрыть скобу 221 одиночная кавычка 222

Зелл Лью заметил, что 3 из этих кодов клавиш в Firefox отличаются от остальных браузеров.

• ; 59 в Firefox, но 186 в других браузерах.
• = 61 в Firefox, но 187 в других браузерах.
• - составляет 173 в Firefox, но 189 в других браузерах.

Важное примечание: эти значения кода ключа действительны только во время событий in keydownи keyup. На Mac keypressсобытия дают вам совершенно другой набор кодов.

Например:

Ключ	event.which в ключе	event.which при нажатии
а	65	97
б	66	98
c	67	99