HTML атрибут событий onblur

Значение и применение

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

Поддержка браузерами

Атрибут событий	Chrome	Firefox	Opera	Safari	IExplorer	Edge
onblur	Да	Да	Да	Да	Да	Да

Синтаксис

<element onblur =  "script" >

Пример использования

Пример автоматического изменения регистра букв при потере фокуса с элемента:

<!DOCTYPE html>
<html>
<head>
<title>Событие onblur</title>
</head>
<body>
<p>Введите произвольные данные маленькими буквами и кликните вне поля:</p>
<b>Имя и фамилия владельца карты:</b>
<input type = "text" name = "cardname" id = "cardname" onblur = "testFunction()">
<script>
	function testFunction() {
	var z = document.getElementById("cardname");
	z.value = z.value.toUpperCase(); 
}
</script>
</body>
</html>

Введите произвольные данные маленькими буквами и кликните вне поля:

Имя и фамилия владельца карты:

<!DOCTYPE html>
<html>
<head>
<title>Событие onblur</title>
</head>
<body>
<p>Кликните по полю, а затем рядом с ним.</p>
<input type = "text" name = "testInput" id = "testInput" onblur = "blurFunction()" onfocus = "focusFunction()">
<script>
function blurFunction() {
	document.getElementById("testInput").style.background = "khaki";
}
function focusFunction() {
	document.getElementById("testInput").style.background = "red";
}
</script>
</body>
</html>

Кликните по полю, а затем рядом с ним. При нажатии на элемент, благодаря атрибуту событий onfocus срабатывает скрипт, когда элемент получает фокус, а благодаря атрибуту событий onblur, скрипт запускается при потере фокуса.

Отличия HTML 4.01 от HTML 5

Нет.

Поддерживаемые теги

Все HTML-элементы, за исключением: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> и <title>.

Атрибуты событий