События в JavaScript

События в JavaScript

События  - это функции, которые могут быть привязаны к элементам HTML страниц.

Код событий выполнится только после того, как произойдет их  активирующее действие . Разные типы событий имеют разные активирующие действия.

Примеры активирующих действий JavaScript:

• Щелчок мыши ( событие onclick );
• Нажатие клавиши ( onkeypress );
• Отправление формы ( onsubmit );
• Наведение курсора мыши на элемент ( onmouseover ) или выведение курсора мыши за пределы границ элемента ( onmouseout );
• Полная загрузка страницы или картинки ( onload );
• Изменение содержимого элемента, например содержимого текстового поля формы ( onchange ).

Событие onсlick

Код события  onclick  будет выполнен после того, как пользователь щелкнет на элемент, к которому привязано это событие

function messageShow() { document.write('Вы нажали на кнопку!');}

Событие onload

Код события onload будет выполнен при полной загрузке страницы.

function messageShow() { alert('Страница была загружена!');}

События onmouseover и onmouseout

События   onmouseover  и  onmouseout   часто используются, чтобы создать "анимированные" кнопки.

Код события onmouseover будет выполнен, когда на элемент, к которому привязано событие, будет наведен курсор мыши.

Код события onmouseout будет выполнен при выведении курсора мыши за пределы элемента.

function textchange() { document.getElementById('mes').style.backgroundColor=

'green'; }

function textreturn() { document.getElementById('mes').style.color='white'; document.getElementById('mes').style.backgroundColor= 'blue'; }

#mes

{

color:white;

border-style:solid;

width:350px;

text-align:center;

border-color:black;

border-width:1px;

padding-top:3px;

padding-bottom:3px;

background-color:blue;

}

function textChange() {

document.getElementById('mes').style.backgroundColor='green';

}

function textReturn() {

document.getElementById('mes').style.color='white';

document.getElementById('mes').style.backgroundColor='blue';

}