Події в HTML 5

→ Блог → Програмування

Подія onabort в HTML5
Викликається коли виконання події переривається. Наприклад коли браузер припиняє отримання даних до того, як всі вони завантажені (користувач натиснув кнопку Stop). Ця подія часто прослуховується в тега img.

Подія onblur в HTML5
Викликається коли об'єкт втратив фокус. Наприклад, якщо користувач натиснув у перший input, а потім клацнув по другому inputу то у першого викличеться обробник onblur.

Подія oncanplay в HTML5
Викликається браузером коли відтворення медіа контенту вже може бути розпочато, але ще не вся інформація завантажена. Тобто відтворення почнеться, але не буде тривати до кінця, тому що буде потрібно додатковий час для довантаження контенту.

Подія oncanplaythrough в HTML5
Викликається браузером в тому випадку, якщо весь медіа контент завантажений і при відтворенні не буде потрібно додаткового часу для буферизації.

Подія onchange в HTML5
Викликається коли об'єкт був змінений користувачем і втратив фокус (тобто клікнув в іншому місці). Наприклад коли користувач змінив текст в input і клікнув по іншому об'єкту. Або наприклад в полі select був вибраний якийсб пункт

Подія onclick в HTML5
Викликається коли користувач клацнув курсором по об'єкту, блоку чи елементі лівою клавішою миші.

Подія oncontextmenu в HTML5
Викликається коли було викликано контекстне меню (зазвичай клік правою кнопкою миші).

Подія ondblclick в HTML5
Викликається коли користувач здійснив подвійний клік по об'єкту лівою кнопкою миші.

Подія ondrag в HTML5
Викликається коли об'єкт починає перетягуватись користувачем, тобто відбувається переміщення миші при натиснутій лівій кнопці.

Подія ondragend в HTML5
Викликається коли користувач перестає перетягувати об'єкт.

Подія ondragenter в HTML5
Ця подія викликається коли об'єкт (елемент) що перетягується потрапляє на об'єкт-приймач

Подія ondragleave в HTML5
Викликається коли перетягуємий об'єкт залишає об'єкт-приймач. Тобто користувач спочатку перетягнув обєкт на приймач, а потім перетягнув його в інше місце.

Подія ondragover в HTML5
Викликається під час переміщення перетягуваного об'єкта над об'єктом-приймачем.

Подія ondragstart в HTML5
Викликається коли процес перетягування об'єкта почався. Тобто користувач натиснув кнопку миші і почав перетягувати об'єкт.

Подія ondrop в HTML5
Викликається коли переміщуваний об'єкт потрапляє на об'єкт приймач і користувач відпускає кнопку миші.

Подія ondurationchange в HTML5
Викликається коли змінюється довжина медіа файлу (тобто коли змінюється атрибут duration). Ця подія найчастіше застосовується в тегах video і audio.

Подія onemptied в HTML5
Викликається коли доступ до медіа контенту обривається. Наприклад коли виникають проблеми з інтернет з'єднанням.

Подія onended в HTML5
Викликається коли медіа елемент повністю відтворив весь зміст. Тобто наприклад в тезі audio пісня закінчилась.

Подія onerror в HTML5
Викликається якщо при завантаженні елемента сталася помилка.

Подія onfocus в HTML5
Викликається коли елемент отримує фокус. Наприклад коли користувач клацає по об'єкту (наприклад по текстовому полю) мишею або перемикає на нього фокус за допомогою клавіші Tab.

Подія onformchange в HTML5
Викликається коли змінюється будь-яке з полів форми. Може бути вказано як у тега form так і у дочірніх елементів форми (input, textarea і т.д.)

Подія onforminput в HTML5
Викликається при зміні змісту полів форми. Діє відразу для всієї форми. На відміну від події onchange подія onforminput викликається відразу ж після зміни, не чекаючи коли поле втратить фокус. Ця подія може вказуватися як у тега form, так і у дочірніх елементів (input, textarea і т.д.).

Подія oninput в HTML5
Ця подія викликається при зміні змісту одного поля форми. На відміну від події onchange - подія oninput не чекає коли змінене поле втратить фокус. Може вказуватися тільки у внутрішніх тегах тега form.

Подія oninvalid в HTML5
Викликається коли невірно введено поле форми.

Подія onkeydown в HTML5
Викликається коли користувач натиснув клавішу клавіатури, причому фокус має той елемент, у якого встановлено прослуховування цієї події.

Подія onkeypress в HTML5
Викликається коли клавіша клавіатури була натиснута і відпущена при сфокусованому об'єкті. Наприклад в текстовому полі була введена буква але клавіша клавіатури ще не відпущена.

Подія onkeyup в HTML5
Викликається коли клавіша клавіатури була відпущена.

Подія onload в HTML5
Викликається коли об'єкт сторінки завантажений.
Важливо: якщо ця подія зазначено у тега body то воно має інше значення (читайте нижче у властивостях тега body).

Подія onloadeddata в HTML5
Викликається коли завантажених браузером даних досить для початку відтворення медіа даних з поточного місця.

Подія onloadedmetadata в HTML5
Викликається коли браузер виходить такі дані як тривалість медіа даних, або габаритні розміри (наприклад ширина і висота у тега video).

Подія onloadstart в HTML5
Викликається коли браузер тільки починає завантажувати медіа дані з сервера.

Подія onmousedown в HTML5
Викликається коли користувач натиснув ліву кнопку миші над об'єктом.

Подія onmousemove в HTML5
Викликається коли користувач переміщує курсор миші над об'єктом.

Подія onmouseout в HTML5
Викликається коли курсор миші покидає область об'єкта. Наприклад мишка була над елементом, потім вона була перетягнута за межі елемента викличеться ця подія.

Подія onmouseover в HTML5
Викликається коли курсор миші попадає на область об'єкта. Тобто якщо подія onmousemove викликається постійно при русі миші всередині об'єкта, то подія onmouseover викликається тільки один раз, коли курсор потрапляє на об'єкт.

Подія onmouseup в HTML5
Викликається коли користувач відпускає натиснуту ліву кнопку миші.

Подія onmousewheel в HTML5
Викликається коли користувач скористався (покрутив) прокруткою на миші.

Подія onpause в HTML5
Викликається коли відтворення медіа даних припинено (аудіо, відео).

Подія onplay в HTML5
Викликається при старті відтворення медіа даних.

Подія onplaying в HTML5
Викликається коли розпочато відтворення медіа даних.

Подія onprogress в HTML5
Викликається браузером при переміщенні "головки відтворення" медіа даних.

Подія onratechange в HTML5
Викликається коли змінюється швидкість відтворення медіа даних. Тобто коли змінюються атрибути defaultPlaybackRate або playbackRate

Подія onreadystatechange в HTML5
Викликається коли змінюється стан завантаження даних (з "завантажується" на "додано").

Подія onscroll в HTML5
Викликається коли користувач скористався прокруткою елемента.

Подія onseeked в HTML5
Викликається коли атрибут seeked у тега audio або video змінює значення з true на false.

Подія onseeking в HTML5
Викликається коли атрибут seeking у тегів audio або video змінює значення з false на true. Тобто починається переміщення головки відтворення.

Подія onselect в HTML5
Викликається коли частина або весь вміст об'єкта виділяється користувачем. Наприклад коли частина тексту в textarea користувач виділив з допомогою миші.

Подія onshow в HTML5
Викликається коли користувач вимагає відобразити елемент у вигляді контекстного меню.

Подія onstalled в HTML5
Викликається коли браузер намагається отримати медіа дані, але при цьому виникає помилка (тобто дані не можуть бути прочитані або не надходять в браузер).

Подія onsubmit в HTML5
Викликається коли користувач відправляє дані форми на сервер. Тобто натиснув кнопку submit.

Подія onsuspend в HTML5
Браузер навмисно припиняє завантаження даних для елементів audio або video, хоча ще не весь контент завантажений.

Подія ontimeupdate в HTML5
Викликається коли змінилося становище головки відтворення елемента audio або video.

Подія onvolumechange в HTML5
Викликається коли змінюється атрибут volume або muted у елементів audio або video. Тобто змінюється гучність звуку.

Подія onwaiting в HTML5
Викликається коли наступний кадр при відтворенні медіа даних недоступний, але браузер очікує що він незабаром завантажиться.

Події тега body

Подія onafterprint тега body в HTML5
Подія викликається після відправки поточної сторінки на друк.
Ця подія зазвичай використовується в зв'язці з подією onbeforeprint.
Наприклад якщо для друку документа потрібно його видозмінити. За події onbeforeprint відбуваються потрібні зміни, а потім після друку викликається подія onafterprint і документ приймає вихідний вид.

Подія onbeforeprint тега body в HTML5
Викликається безпосередньо перед відправкою документа на друк. Зазвичай використовується в зв'язці з подією onafterprint. Наприклад якщо для друку документа потрібно його видозмінити. За події onbeforeprint відбуваються потрібні зміни, а потім після друку викликається подія onafterprint і документ приймає вихідний вид.

Подія onbeforeunload тега body в HTML5
Викликається безпосередньо перед закриттям сторінки.
Зручно використовувати, наприклад, якщо потрібно попередити користувача що він покидає цю сторінку. Наприклад користувач пише листа і закриває цю сторінку, то йому може вивестись повідомлення з текстом "Ви впевнені що хочете закриту цю сторінку, лист ще не відправлений!"

Подія onblur тега body в HTML5
Викликається коли користувач перемикається або на іншу вкладку браузера, або на інше вікно, або взагалі активує інший додаток (програму) на комп'ютері. Протилежно події onfocus.

Подія onerror тега body в HTML5
Викликається якщо під час завантаження документа відбулася помилка. Також використовується для відстеження помилок в скриптах.

Подія onfocus тега body в HTML5
Викликається коли користувач активував поточну вкладку в браузері. Ця подія протилежна події onblur.

Подія onhashchange тега body в HTML5
Ця подія змінюється коли змінюється hash частина посилання. hash частина зберігається у змінній location.hash і являє собою, наприклад, ідентифікатор сесії. Така подія буде викликатися наприклад при переході зі сторінки http://aquariaclub.ru/about.php # nauchnaya_akvariumistika на сторінку http://aquariaclub.ru/about.php # akvariumnoe_ribovodstvo або ж при зміні змінної location.hash. В майбутньому співтовариство WHATWG планує з використанням цієї події робити посилання на певне місце у відеоролику, але ця функція поки тільки в стадії ідеї.

Подія onload тега body в HTML5
Подія викликається відразу після повного завантаження документа.

Подія onmessage тега body в HTML5
Викликається коли отримано повідомлення відправлене даному об'єкту windows за допомогою функції postMessage ();

Подія onoffline тега body в HTML5
Викликається коли оглядач чи як його ще називають бровзер визначає, що з'єднання з Інтернет втрачено. Може використовуватися, наприклад, для блокування деяких функцій на сайті, або ж для попередження користувача про відключення. Якщо відключаєте що небудь цією функцією то не забудьте скористатися подією ononline, яке є протилежністю даної події. P.S. Можна виводити повідомлення нокштаут "УПС Інтернет пропав, мабуть за не уплату".

Подія ononline тега body в HTML5
Викликається коли з'єднання з інтернет відновилося після обриву. Використовується в зв'язці з подією onoffline. Якщо Ви відключили якісь функції на сайті після виклику події onoffline, то необхідно включити їх по настанні події ononline.

Подія onpagehide тега body в HTML5
Викликається якщо користувач намагається піти зі сторінки вперед по історії (history) або назад. Тобто наприклад клікає на кнопку "Вперед" або "Назад" в браузері.

Подія onpageshow тега body в HTML5
Викликається коли користувач приходить на сторінку шляхом переміщення по історії (history) вперед або назад. Тобто по кліку на кнопку "Вперед" або "Назад" у браузері.

Подія onpopstate тега body в HTML5
Викликається коли користувач переходить на цю сторінку шляхом вибору її в історії (history) браузера.

Подія onredo тега body в HTML5
Використовується для операцій "Скасувати" і "Оновити". Наприклад коли користувач випадково натиснув "Скасувати" при завантаженні сторінки, а потім натиснув "Оновити".

Подія onresize тега body в HTML5
Ця подія викликається коли вікно оглядача змінює свій розмір. Тобто змінюються атрибути width і height бравзера.

Подія onstorage тега body в HTML5
Викликається коли змінюється зміст сховища (Web Storage) об'єкта window або document.

Подія onundo тега body в HTML5
Викликається коли користувач натиснув на кнопку "Скасувати".

Подія onunload тега body в HTML5
Ця подія викликається коли користувач покидає дану сторінку.