Что такое event в JavaScript?

"Event в JavaScript". "Что такое event в JavaScript?"

Разбираем вопрос про event в JavaScript, работу с событиями (event) в целом и конкретный синтаксис.

Event в JavaScript.

1. Что такое event в JavaScript?
2. Как использовать event в JavaScript?
3. Объект event в JavaScript.
4. Пример использования event в JavaScript.

1. Что такое event в JavaScript?

Event (событие) — это сигнал о том, что что‑то произошло в браузере: клик мыши, нажатие клавиши, загрузка страницы и т. д. Обработчики событий позволяют реагировать на эти действия.

Основные типы событий, event в JavaScript.

Мышь и event в JavaScript.

click(onclick),

dblclick,

mouseover,

mouseout,

mousedown,

mouseup.

Клавиатура и event в JavaScript.

keydown,

keyup,

keypress.

Форма и event в JavaScript.

submit,

change,

input,

focus,

blur.

Документ: DOMContentLoaded и event в JavaScript.

load,

unload

Касания (мобильные) и event в JavaScript.

touchstart,

touchend,

touchmove.

2. Как использовать event в JavaScript?

1. Добавление обработчика

Способ 1: через addEventListener (рекомендуемый):

element.addEventListener('click', function(event) {

// код обработки

});

Способ 2: через свойство onclick (устаревший):

element.onclick = function(event) {

// код обработки

};

3. Объект event в JavaScript.

Что такое "объект event в JavaScript"?

Когда событие срабатывает, браузер передаёт в обработчик объект event, содержащий информацию о событии.

Ключевые свойства: event в JavaScript.

event.type — тип события ('click', 'keydown' и т. д.).

event.target — элемент, на котором произошло событие.

event.currentTarget — элемент, к которому прикреплён обработчик.

event.preventDefault() — отменяет действие по умолчанию (например, отправку формы).

event.stopPropagation() — останавливает всплытие события (bubbling).

event.clientX, event.clientY — координаты курсора.

event.key — нажатая клавиша (для событий клавиатуры).

4. Пример использования event в JavaScript.

Рассмотрим самый простейший пример "использования event в JavaScript".

Для этого вам понадобится:

Используем кнопку button.

Прямо внутрь тега ставим onclick.

Чтобы увидеть "event в js" используем alert.

Соберем ваш первый код event в JavaScript.

<button onclick="alert('Ты увидел event в JavaScript в действии!')">Посмотри event в JavaScript - нажми на меня!</button>

Пример event в JavaScript.

На сайте только живые примеры, поэтому размещаем код "event js" прямо здесь:

Чтобы увидеть действие "event js" нажмите кнопку "Посмотри event в JavaScript - нажми на меня!":

Посмотри event в JavaScript - нажми на меня!

Всего комментариев : Comments+ 2.0

+ =