Опубликовано: 01.04.2011 Последняя правка: 10.12.2015
HTMLXHTML
IEChromeFireFoxOperaSafari

Событие onkeydown

Событие onkeydown — это атрибут HTML-тегов, который применяется для вызова скрипта (напр. JavaScript), когда над элементом, который в данный момент имеет фокус, нажимается клавиша клавиатуры.

Тип события

Назначение: служит для вызова скриптов при возникновении определенного события на HTML-странице.

Применяется: в HTML 4.01 и XHTML к тегам <A>, <ABBR>, <ACRONYM>, <ADDRESS>, <AREA>, <B>, <BIG>, <BLOCKQUOTE>, <BODY>, <BUTTON>, <CAPTION>, <CENTER>, <CITE>, <CODE>, <COL>, <COLGROUP>, <DD>, <DEL>, <DFN>, <DIR>, <DIV>, <DL>, <DT>, <EM>, <FIELDSET>, <FORM>, <H1...H6>, <HR>, <I>, <IMG>, <INPUT>, <INS>, <KBD>, <LABEL>, <LEGEND>, <LI>, <LINK>, <MAP>, <NOFRAMES>, <NOSCRIPT>, <OBJECT>, <OL>, <OPTGROUP>, <OPTION>, <P>, <PRE>, <Q>, <S>, <SAMP>, <SELECT>, <SMALL>, <SPAN>, <STRIKE>, <STRONG>, <SUB>, <SUP>, <TABLE>, <TBODY>, <TD>, <TEXTAREA>, <TFOOT>, <TH>, <THEAD>, <TR>, <TT>, <U>, <UL>, <VAR>.

В HTML 5 событие onkeydown может использоваться практически со всеми тегами.

Некоторые популярные браузеры не поддерживают onkeydown для отдельных тегов, но при этом многие из них поддерживают это событие для тех тегов, в которых его запрещено использовать, а также для тех, которые вообще не входят в официальную спецификацию HTML.

Значения

Значением события onkeydown является код скрипта заключенный в двойные или одинарные кавычки, причем, если применяются двойные кавычки, то внутри тела скрипта можно указывать только одинарные и наоборот.

Значение по умолчанию: нет.

Синтаксис

<button onkeydown="скрипт">...</button>
<input onkeydown="скрипт">
<div onkeydown="скрипт">...</div>

Обязательный атрибут: нет.

Пример HTML: применение события onkeydown к тегу INPUT

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>seodon.ru - Тег INPUT, событие onkeydown</title>
  <script type="text/javascript">
   function foncolor(color) {
    document.bgColor=color;
   }
  </script>
 </head>
 <body>
  <div>
    <input type="radio" name="color" value="red" onkeydown="foncolor(this.value)">Красный
    <input type="radio" name="color" value="green" onkeydown="foncolor(this.value)">Зеленый
    <input type="radio" name="color" value="blue" onkeydown="foncolor(this.value)">Синий
  </div>
 </body>
</html>

Результат примера

В этом примере при выборе переключателей с помощью мыши ничего не произойдет, но, если выбор делать кнопками клавиатуры, то сработает событие onkeydown и фоновый цвет страницы будет изменен. Обратите внимание, что цвет меняется с опозданием на один шаг от указанного в переключателях. Это происходит потому, что при нажатии клавиши браузер сначала берет значение цвета в текущем переключателе и только потом делает переход к следующему. Для того, чтобы пара цвет-переключатель совпадала можно использовать событие onkeyup.

Поддержка версиями HTML

Версия:HTML 4.01HTML 5XHTML 1.0XHTML 1.1
Поддержка:ДаДаДаДа

Поддержка браузерами

Браузер:Internet ExplorerGoogle ChromeMozilla FirefoxOperaSafari
Версия:6.0 и выше2.0 и выше2.0 и выше9.2 и выше3.1 и выше
Поддержка:ДаДаДаДаДа