Событие onblur в JavaScript
Событие JavaScript onblur запускается, когда элемент теряет фокус, например, когда пользователь щёлкает мышью за пределами поля ввода или нажимает Tab. Это событие может быть полезно для проверки ввода формы, скрытия или отображения дополнительного содержимого или запуска других действий.
Вот пример использования onblur события для проверки того, что ввод формы пуст:
<form>
<label for="name">Имя:</label>
<input type="text" id="name" onblur="validateName()">
<span id="nameError"></span>
</form>
<script>
function validateName() {
let name = document.querySelector("#name").value;
if (name == "") {
document.querySelector("#nameError").innerHTML = "Требуется имя.";
} else {
document.querySelector("#nameError").innerHTML = "";
}
}
</script>
<label for="name">Имя:</label>
<input type="text" id="name" onblur="validateName()">
<span id="nameError"></span>
</form>
<script>
function validateName() {
let name = document.querySelector("#name").value;
if (name == "") {
document.querySelector("#nameError").innerHTML = "Требуется имя.";
} else {
document.querySelector("#nameError").innerHTML = "";
}
}
</script>
В этом примере функция validateName() вызывается, когда пользователь нажимает Tab или щёлкает за пределами поля ввода "Имя". Если ввод пуст, рядом с полем ввода отображается сообщение об ошибке.
Важно отметить, что onblurсобытие поддерживается всеми основными браузерами, включая Internet Explorer, Google Chrome и Mozilla Firefox.
