пример
Выполнение JavaScript, когда пользователь покидает поле ввода:
<input type="text" onblur="myFunction()">
Попробуй сам " Больше "Try it Yourself" примеры ниже.
Определение и использование
ONBLUR событие возникает, когда объект теряет фокус.
Событие ONBLUR наиболее часто используется с кодом проверки формы (например, когда пользователь покидает поле формы).
Tip: ONBLUR событие является противоположностью OnFocus события.
Совет: ONBLUR событие похоже на onfocusout события. Основное отличие состоит в том, что ONBLUR событие не пузырь. Поэтому, если вы хотите, чтобы выяснить, теряет ли элемент или его ребенок фокус, вы можете использовать onfocusout событие. Тем не менее, вы можете достичь этого, используя дополнительный параметр useCapture в addEventListener() метод для события ONBLUR.
Поддержка браузеров
| Мероприятие | |||||
|---|---|---|---|---|---|
| onblur | да | да | да | да | да |
Синтаксис
В HTML:
В JavaScript:
object .onblur=function(){ Попробуй сам " В JavaScript, используя addEventListener() метод:
object .addEventListener("blur", myScript );
Попробуй сам " Примечание: addEventListener() метод не поддерживается в Internet Explorer 8 и более ранних версий.
Технические подробности
| Пузыри: | нет |
|---|---|
| аннулированию: | нет |
| Тип события: | FocusEvent |
| Поддерживаемые HTML-теги: | ВСЕ HTML элементы, КРОМЕ: <основание>, <БДО> <br>, <HEAD>, <HTML>, <IFRAME>, <META>, <PARAM>, <скрипт>, <стиль> и <title> |
| DOM Версия: | Уровень 2 События |
Еще примеры
пример
Использование "onblur" вместе с "onfocus" событие:
<input type="text" onfocus="focusFunction()" onblur="blurFunction()">
Попробуй сам " пример
Делегация события: настройка параметра useCapture из addEventListener() к истине:
<form id="myForm">
<input type="text" id="myInput">
</form>
<script>
var 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 = "";
}
</script>
Попробуй сам " пример
Делегация события: с помощью события focusin (не поддерживается Firefox):
<form id="myForm">
<input type="text" id="myInput">
</form>
<script>
var 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 = "";
}
</script>
Попробуй сам " <Объект Event