Описание: Привязывает обработчик события к событию "focus" JavaScript, или вызывает данное событие на элемент.
.focus( handler(объектСобытия) )
Добавлена в версию: 1.0
handler(объектСобытия)
Функция выполняется каждый раз, когда вызывается событие.
.focus( )
Добавлена в версию: 1.0
.focus( [ данныеСобытия ], обработчик(объектСобытия)
Добавлена в версию: 1.4.3
данныеСобытия
Карта данных, которая будет передана в обработчик событий.
обработчик(объектСобытия)
Функция для выполнения каждый раз, когда событие вызвано.
-
Этот метод является сокращением для
.bind('focus', handler)в первом варианте, и.trigger('focus')во втором. - Событие
focusпередается элементу, когда он получает фокус. Это событие косвенным образом, применимо к ограниченному набору элементов, таких как элементы формы (<input>,<select>, и так далее) и линки (<a href>). В последних версиях браузера, это событие может быть распространенно на все типы элементов, явно устанавливая свойствоtabindex. Элемент может получить фокус с помощью клавиатурных команд, таких как 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>
Обработчик события может быть связан с первым полем ввода:
$('#target').focus(function() {
alert('Handler for .focus() called.');
});
Теперь, если щелкнуть на первом поле, или перейти на него при помощи табуляции из другой области, будет выдано предупреждение:
Handler for .focus() called.
Мы можем также вызвать событие, когда другой элемент нажат:
$('#other').click(function() {
$('#target').focus();
});
После выполнения этого кода, нажатие на Trigger the handler также выдаст сообщение.
Событие focus ограниченно выполняется в Internet Explorer.
Таким образом, сценарии, которые основанны на делегации события с событием focus
не будут последовательно работать во всех браузерах.
Запуск фокуса на скрытые элементы приводит к ошибке в Internet Explorer. Позаботесь вызывать
.focus()без параметров только на видимые элементы.
Примеры
Пример 1
Активирует событие focus.Пример 1 - Полный код:
Активирует событие focus.<!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").focus(function () {
$(this).next("span").css('display','inline').fadeOut(1000);
});
});
</script>
<style>span {display:none;}</style>
</head>
<body>
<p><input type="text" /> <span>focus fire</span></p>
<p><input type="password" /> <span>focus fire</span></p>
</body>
</html>
Пример 2
Чтобы запретить пользователям писать что-либо в поля ввода, попробуйте сделать так:Пример 2 - Полный код:
Чтобы запретить пользователям писать что-либо в поля ввода, попробуйте сделать так:<!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[type=text]").focus(function(){
$(this).blur();
});
});
</script>
</head>
<body>
<input type="text" />
</body>
</html>
Пример 3
Для того, чтобы при загрузке страницы немедленно передать фокус элементу с ID ‘login’, можно сделать так:$(document).ready(function(){ $("#login").focus(); });
Была ли эта информация полезной?
