Описание: Привязывает обработчик события к событию "blur" JavaScript, или вызывает данное событие на элемент.
.blur( handler(объектСобытия) )
Добавлена в версию: 1.0
handler(объектСобытия)
Функция выполняется каждый раз, когда вызывается событие.
.blur( )
Добавлена в версию: 1.0
.blur( [ данныеСобытия ], обработчик(объектСобытия) )
Добавлена в версию: 1.4.3
данныеСобытия
Карта данных, которая будет передана в обработчик событий.
обработчик(объектСобытия)
Функция для выполнения каждый раз, когда событие вызвано.
Этот метод является сокращением для .bind('blur', handler)
в первом варианте, и .trigger('blur') во втором.
Событие blur посылается элементу, когда он теряет фокус.
Первоначально, это событие было применимо только к элементам формы,
таким как <input>.
В последних версиях браузеров, сфера события была распространена на все типы элементов.
Элемент может потерять фокус с помощью команд клавиатуры, таких как кнопка Tab или нажатие мышки, где-либо на данной странице.
Рассмотрим, например, HTML:
<form>
<input id="target" type="text" value="Field 1" />
<input type="text" value="Field 2" />
</form>
<div id="other">
Trigger the handler
</div>
The event handler can be bound to the first input field:
$('#target').blur(function() {
alert('Handler for .blur() called.');
});
Теперь, если первое поле в фокусе, и мы щелкним в другом месте, или перейдем с помощью клавиши Tab, будет выдано предупреждение:
Handler for .blur() called.
Мы можем вызвать событие, когда другой элемент нажат:
$('#other').click(function() {
$('#target').blur();
});
После выполнения этого кода, нажатие по Trigger the handler также выдаст сообщение.
Событие blur плохо управляется в Internet Explorer.
Таким образом, сценарии, которые основанны на событии делегирования с событием blur не будут последовательно работать во всех браузерах.
Пример 1
Вызывает событие blur во всех параграфах:$("p").blur();
Пример 2
Активирует событие blur.Пример 2 - Полный код:
Активирует событие blur.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$("input").blur(function () {
$(this).next("span").css('display','inline').fadeOut(1000);
});
});
</script>
<style>span {display:none;}</style>
</head>
<body>
<p><input type="text" /> <span>blur fire</span></p>
<p><input type="password" /> <span>blur fire</span></p>
</body>
</html>
Была ли эта информация полезной?
