What is onblur in html

onblur Event

The onblur event occurs when an HTML element loses focus.

The onblur event is often used on input fields.

The onblur event is often used with form validation (when the user leaves a form field).

Focus Based Events

See Also:

Syntax

In JavaScript, using the addEventListener() method:

Technical Details

Bubbles:	No
Cancelable:	No
Event type:	FocusEvent
HTML tags:	ALL HTML elements, EXCEPT: , , , , , , , , , , and
DOM Version:	Level 2 Events

More Examples

Example

Using onfocus and onblur attributes:

Example

Event delegation: using focus and blur events:

Set useCapture parameter of addEventListener() to true:

let x = document.getElementById(«myForm»);
x.addEventListener(«focus», myFocusFunction, true);
x.addEventListener(«blur», myBlurFunction, true);

function myFocusFunction() document.getElementById(«myInput»).style.backgroundColor = «yellow»;
>

function myBlurFunction() document.getElementById(«myInput»).style.backgroundColor = «»;
>

Example

Event delegation: using focusin and focusout events:

let x = document.getElementById(«myForm»);
x.addEventListener(«focusin», myFocusFunction);
x.addEventListener(«focusout», myBlurFunction);

function myFocusFunction() document.getElementById(«myInput»).style.backgroundColor = «yellow»;
>

function myBlurFunction() document.getElementById(«myInput»).style.backgroundColor = «»;
>

Browser Support

onblur is a DOM Level 2 (2001) feature.

It is fully supported in all browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	9-11

Источник

HTML onblur Event Attribute

The onblur attribute fires the moment that the element loses focus.

Onblur is most often used with form validation code (e.g. when the user leaves a form field).

Tip: The onblur attribute is the opposite of the onfocus attribute.

Browser Support

Syntax

Attribute Values

Technical Details

More Examples

Example

Using «onblur» together with the «onfocus» attribute:

Related Pages

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

HTML onblur Attribute

The onblur attribute fires the moment that the element loses focus.

Onblur is most often used with form validation code (e.g. when the user leaves a form field).

Tip: The onblur attribute is the opposite of the onfocus attribute.

Applies to

The onblur attribute is part of the Event Attributes, and can be used on any HTML elements.

Elements	Event
All HTML elements	onblur

Example

Validate an input field when the user leaves it:

Browser Support

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

HTML Атрибут onblur

Атрибут onblur срабатывает в момент, когда элемент теряет фокус.

Атрибут onblur чаще всего используется с кодом проверки формы (например, когда пользователь покидает поле формы).

Совет: Атрибут onblur , а атрибут onfocus наоборот другой.

Применение

Атрибут onblur является частью Атрибута Событий и может быть использован на следующий элемент:

Элемент	Событие
Все элементы HTML	onblur

Пример

Проверка поля ввода, когда пользователь покидает его:

Поддержка браузеров

Мы только что запустили
SchoolsW3 видео

ВЫБОР ЦВЕТА

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо:

Ваше предложение:

Спасибо Вам за то, что помогаете!

Ваше сообщение было отправлено в SchoolsW3.

ТОП Учебники

ТОП Справочники

ТОП Примеры

Получить сертификат

SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности.

Источник