Атрибуты событий
Событиями называют реакцию браузера на определенные действия пользователя и внутреннего взаимодействия скриптов. Пользователь генерирует события, когда нажимает на кнопку мыши или клавиатуру, загружает документ, переводит фокус от одного элемента к другому и т.д.
Каждому событию назначается обработчик, написанная на языке сценариев (таких как JavaScript) функция, которая срабатывает, как только событие произошло. Одним из способов сделать это - назначить обработчик прямо в разметке, используя атрибуты событий.
Ниже приводим таблицу атрибутов событий, которые могут быть добавлены к HTML элементам для инициирования определенных действий.
Атрибуты событий окна ¶
События объекта окна используются с тегом <body>.
| Атрибут | Описание |
|---|---|
| onafterprint | Запускается после вывода страницы на печать. Новый атрибут в HTML5. |
| onbeforeprint | Запускается перед печатью документа. Новый атрибут в HTML5. |
| onbeforeunload | Срабатывает до начала загрузки документа (при попытке покинуть страницу до ее загрузки). Новый атрибут в HTML5. |
| onblur | Запускается, когда окно теряет фокус. |
| onerror | Запускается, если при загрузке документа произошла ошибка. Новый атрибут в HTML5. |
| onhashchange | Запускается при изменении анкора в адресе документа (указывается за #). Новый атрибут в HTML5. |
| onload | Запускается, когда всё содержимое веб-страницы (изображения, внешние таблицы стилей и внешние скрипты) полностью загружено. |
| onmessage | Запускается при получении сообщения. Новый атрибут в HTML5. |
| onoffline | Запускается, когда браузер переходит в режим онлайн. Новый атрибут в HTML5. |
| ononline | Запускается, когда браузер переходит в режим онлайн. Новый атрибут в HTML5. |
| onpagehide | Запускается, когда пользователь покидает страницу. Новый атрибут в HTML5. |
| onpageshow | Запускается, когда пользователь переходит на страницу. Новый атрибут в HTML5. |
| onpopstate | Запускается при изменении окна истории. Новый атрибут в HTML5. |
| onredo | Запускается, когда документ выполняет восстановление последней операции. Новый атрибут в HTML5. |
| onresize | Запускается, когда изменяется размер окна. Новый атрибут в HTML5. |
| onstorage | Запускается при обновлении веб-хранилища данных. Новый атрибут в HTML5. |
| onundo | Запускается при выполнении команды отменить в документе. Новый атрибут в HTML5. |
| onunload | Запускается при выходе пользователя из документа. Новый атрибут в HTML5. |
Атрибуты событий формы¶
К событиям формы относятся те события, которые возникают при выполнении действий с HTML формами.
Атрибуты событий формы могут быть применены ко всем HTML элементам, но обычно их используют в элементах формы.
| Атрибут | Описание |
|---|---|
| onblur | Запускается, когда элемент теряет фокус. |
| onchange | Запускается при изменении значения элемента. |
| oncontextmenu | Запускается при вызове контекстного меню на элементе. Новый атрибут в HTML5. |
| onfocus | Запускается, когда элемент получает фокус. |
| oninput | Запускается, когда пользователь вводит данные в элемент. Новый атрибут в HTML5. |
| oninvalid | Запускается, если введенное значение элемента не корректно, т.е. не удовлетворяет требованиям (например, не заполнено обязательное поле - атрибут required). Новый атрибут в HTML5. |
| onreset | Запускается при нажатии кнопки Reset (сброс значений) в форме. Новый атрибут в HTML5. |
| onsearch | Запускается при нажатии клавиши "Enter" или кнопки "х" в элементе <input> (type="search"). |
| onselect | Запускается при выделении текста в элементе. |
| onsubmit | Запускается при отправке формы. |
Атрибуты событий клавиатуры¶
События, инициируемые клавиатурой, могут применяться ко всем элементам HTML.
| Атрибут | Описание |
|---|---|
| onkeydown | Запускается, когда пользователь нажимает на любую клавишу. |
| onkeypress | Запускается, после того, как пользователь нажал на клавишу (не работает с такими клавишами как Alt, Ctrl, Shift, Esc, PrScr и т.п.). |
| onkeyup | Запускается, после того, как нажатая клавиша была отпущена. |
Атрибуты событий мыши ¶
Атрибуты событий, которые возникают при выполнении действий с мышью, могут применяться ко всем элементам HTML.
| Атрибут | Описание |
|---|---|
| onclick | Запускается при клике мышью. |
| ondblclick | Запускается при двойном клике мышью. |
| ondrag | Запускается при перетаскивании элемента. Новый атрибут в HTML5. |
| ondragend | Запускается в конце операции перетаскивания. Новый атрибут в HTML5. |
| ondragenter | Запускается, когда перетаскиваемый элемент оказался в заданной области. Новый атрибут в HTML5. |
| ondragleave | Запускается, когда перетаскиваемый элемент выходит из допустимой зоны для переноса. Новый атрибут в HTML5. |
| ondragover | Запускается, когда элемент перемещают над допустимой зоной для переноса. Новый атрибут в HTML5. |
| ondragstart | Запускается в начале операции перетаскивания. Новый атрибут в HTML5. |
| ondrop | Запускается после того, когда пользователь отпускает перетаскиваемый элемент. Новый атрибут в HTML5. |
| onmousedown | Запускается при нажатии кнопки мыши. |
| onmousemove | Запускается при перемещении указателя мыши. |
| onmouseover | Запускается, когда указатель мыши перемещается над элементом. |
| onmouseup | Запускается, когда кнопка мыши отпущена. |
| onmousewheel | Запускается, когда прокручивается колесо мыши. Устаревший атрибут (рекомендуется использовать атрибут onwheel). |
| onscroll | Запускается, во время прокручивания полосы прокрутки элемента. Новый атрибут в HTML5. |
| onwheel | Запускается, при использовании колеса мыши на элементе. Новый атрибут в HTML5. |
События буфера обмена¶
| Атрибут | Описание |
|---|---|
| oncopy | Запускается при копировании пользователем содержимого элемента. |
| oncut | Запускается, когда пользователь вырезает содержимое элемента. |
| onpaste | Запускается, когда пользователь вставляет содержимое в элемент. |
События медиа-файлов¶
События, которые возникают в медиа элементах (video, image, audio) могут быть применены к любому HTML элементу, однако наиболее часто они используются в медиа элементах, таких как audio, embed, img, object и video.
| Атрибут | Описание |
|---|---|
| onabort | Запускается при отмене воспроизведения. Новый атрибут в HTML5. |
| oncanplay | Запускается, когда файл готов к проигрыванию (достаточно загружен в буфер). Новый атрибут в HTML5. |
| oncanplaythrough | Запускается, когда файл может быть проигран от начала до конца без остановки для буферизации. Новый атрибут в HTML5. |
| oncuechange | Запускается, когда продолжительность медиа изменяется. Новый атрибут в HTML5. |
| onemptied | Запускается, когда произошла какая-то неполадка и файл стал недоступен (например, при отсутствии подключения к Интернету). Новый атрибут в HTML5. |
| onended | Запускается, когда медиа файл воспроизведен до конца. Новый атрибут в HTML5. |
| onerror | Запускается, когда происходит ошибка при загрузке элемента. Новый атрибут в HTML5. |
| onloadeddata | Запускается при загрузке данных медиа. Новый атрибут в HTML5. |
| onloadedmetadata | Запускается, когда загружены мета-данные (например размер медиа файла, продолжительность и т.д.). Новый атрибут в HTML5. |
| onloadstart | Запускается, если воспроизведение файла приостановлено (нажали паузу) пользователем или программно. Новый атрибут в HTML5. |
| onplay | Запускается при перемещении указателя мыши. Новый атрибут в HTML5. |
| onplaying | Запускается при воспроизведении файла. Новый атрибут в HTML5. |
| onprogress | Запускается, когда браузер находится в процессе получения данных медиа файла. Новый атрибут в HTML5. |
| onratechange | Запускается, когда атрибут поиска медиа элемента (object.seeking) у тегов audio или video имеет значение "false" (поиск завершен, и текущая позиция воспроизведения найдена). Новый атрибут в HTML5. |
| onseeking | Запускается, когда атрибут поиска медиа элемента (object.seeking) у тегов <audio> html5 или <video> html5 имеет значение "true" (поиск начат, текущая позиция воспроизведения перемещается). Новый атрибут в HTML5. |
| onstalled | Запускается, когда браузер не может получить данные медиа файла по какой-либо причине. Новый атрибут в HTML5. |
| onsuspend | Запускается, когда браузер уже начал извлекать медиа данные, но процесс был приостановлен прежде, чем медиа файл был полностью извлечен. Новый атрибут в HTML5. |
| ontimeupdate | Запускается, когда медиа изменяет позицию проигрывания. Новый атрибут в HTML5. |
| onvolumechange | Запускается при изменении уровня громкости медиа, включая режим "mute" (без звука). Новый атрибут в HTML5. |
| onwaiting | Запускается, когда медиа файл остановлен, но ожидается возобновление запуска (например, когда файл делает паузу для буферизации оставшихся данных). Новый атрибут в HTML5. |
Прочие события ¶
| Атрибут | Описание |
|---|---|
| onerror | Запускается, когда происходит ошибка во время загрузки внешнего файла. |
| onshow | Запускается, когда элемент <menu> отображается как контекстное меню. Новый атрибут в HTML5. |
| ontoggle | Запускается, когда пользователь открывает или закрывает элемент <details>. Новый атрибут в HTML5. |