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

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

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

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

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

Атрибут событийChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
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>.

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