Мне нужно, чтобы при каждом нажатии клавиши выполнялась функция, которая будет меняться в зависимости от нажатой клавиши. Поэтому мне нужно знать, какая клавиша была нажата.
Это то, что у меня есть до сих пор:
function onKeyDownHandler() {
console.log("key pressed ", String.fromCharCode(event.keyCode));
}
<input onkeydown="onKeyDownHandler();"/>
Но я все еще не могу получить значение нажатой клавиши.
Вы можете сделать что-то вроде следующего:
Первое, что мы делаем, это включаем переменную
event
в событиеOnKeyDown
. Это служит для того, чтобы во время выполнения события оно могло иметь доступ к информации о ключе.Второй - использовать эту инструкцию:
Это позволяет нам получить код нажатой клавиши. Мы используем
which
, потому что параметрkeyCode
может работать не во всех браузерах.Если вы хотите узнать о других клавишах (Escape, Enter, Shift и т. д.), вы можете посмотреть эту страницу , здесь приведены примеры кодов клавиш.
Про использование инструкция
which
иkeyCode
можно посмотреть по этой ссылке , где указана причина.event.key
легчеДокументация Мозиллы
Если вы используете чистый javascript (без jquery), вам нужно выполнить некоторую проверку перед этим.
Ваш ввод должен принимать параметр события , поскольку в FireFox событие не является глобальным и передается как параметр.
В вашей функции вы должны сначала проверить, откуда исходит событие , если оно входит в параметры (FireFox) или находится в глобальной области видимости (IE). Затем вам нужно получить значение нажатой клавиши с помощью keyCode (IE и FF) или wich (я думаю, Netscape и Opera).
Обратите внимание, что значением ключа будет код ASCII нажатой клавиши.
Короткий ответ
Вместо использования глобального свойства объявите его
event
в качестве аргумента вашей функции.Вместо
keyCode
использованияkey
символьных клавиш , ,shiftKey
а также клавиш Shift, Control, Alt и Windows/Commmand (Mac) соответственно.ctrlKey
altKey
metaKey
Объяснение
В Firefox для Windows код в вопросе не работает, он возвращает
Это происходит потому, что в Internet Explorer и Chrome
event
это глобальное свойство, а не в Firefox.С другой стороны, согласно https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent , оба свойства устарели,
keyCode
иwhich
использованиеkey
. СвойстваshiftKey
,ctrlKey
и вернутся независимоaltKey
от того, была ли нажата соответствующая клавиша.metaKey
true
Помимо того, что они устарели, не все браузеры поддерживают такие свойства.
Дополнительной альтернативой является использование библиотеки, такой как jQuery, которая предназначена для обработки вариантов различных браузеров.
Пример использования «чистого» JavaScript
В следующем примере к элементу добавляется журнал нажатий клавиш,
<input>
а результат печатается в элементе<div>
.Слово «чистый» связано с тем, что объект KeyboardEvent не является объектом спецификации языка JavaScript, а является частью веб-API.
Пример использования jQuery
Одной из целей jQuery является стандартизированная поддержка нескольких браузеров. Ниже приведен пример, в котором применяются рекомендации, упомянутые в разделе краткого ответа, объявление переменной, которой будет присвоен объект события, и использование свойства
key
.