--- title: keydown slug: Web/API/Element/keydown_event translation_of: Web/API/Element/keydown_event ---
{{APIRef}}

Событие keydown срабатывает, когда клавиша была нажата.

В отличии от события {{Event("keypress")}}, событие keydown срабатывает на всех клавишах, независимо от того, есть ли у них значение.

Bubbles Yes
Cancelable Yes
Interface {{domxref("KeyboardEvent")}}
Event handler property {{domxref("GlobalEventHandlers.onkeydown", "onkeydown")}}

События keydown и keyup показывают то, что клавиша была нажата, в то время как keypress показывает то, какой символ был введён. Например, прописную "a" keydown и keyup сообщат как 65, а keypress сообщит как 97. Заглавную же "A" все события сообщают как 65.

События клавиатуры генерируются только в <inputs>, <textarea> и любых элементах с атрибутом contentEditable или tabindex="-1".

Примеры

Примеры addEventListener keydown

Этот пример отображает значение KeyboardEvent.code всякий раз, когда вы нажимаете клавишу внутри <input> элемента.

<input placeholder="Кликните здесь, затем нажмите клавишу." size="40">
<p id="log"></p>
const input = document.querySelector('input');
const log = document.getElementById('log');

input.addEventListener('keydown', logKey);

function logKey(e) {
  log.textContent += ` ${e.code}`;
}

{{EmbedLiveSample("addEventListener_keydown_example")}}

Аналог onkeydown

input.onkeydown = logKey;

Спецификации

Спецификация Статус
{{SpecName("UI Events", "#event-type-keydown")}} {{Spec2("UI Events")}}

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

{{Compat("api.Element.keydown_event")}}

Смотрите также