Содержание:
.on( "focus" [, eventData ], handler )Возвращает: jQuery
Описание: Связывает обработчик событий с событием "focus".
-
версия добавлена: 1.7.on( "focus" [, eventData ], handler )
Эта страница описывает событие focus. Для устаревшего метода .focus(), см. .focus().
- Событие
focusотправляется элементу, когда он получает фокус. Это событие неявно применяется к ограниченному набору элементов, например, к элементам форм (<input>,<select>, и т.д.) и ссылкам (<a href>). В последних версиях браузеров событие может быть расширено, чтобы включать все типы элементов, явно задав свойство элементаtabindex. Элемент может получить фокус с помощью команд клавиатуры, таких как клавиша Tab, или щелчком мыши по элементу. - Элементы с фокусом обычно выделяются браузером каким-либо образом, например, пунктирной линией вокруг элемента. Фокус используется для определения того, какой элемент первым получит события, связанные с клавиатурой.
Попытка установить фокус на скрытый элемент вызывает ошибку в Internet Explorer. Следите за тем, чтобы использовать .trigger( "focus" ) только на видимых элементах. Чтобы запустить обработчики событий фокусировки элемента без установки фокуса на него, используйте .triggerHandler( "focus" ) вместо .trigger( "focus" ).
Например, рассмотрим 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" ).on( "focus", function() {
alert( "Handler for `focus` called." );
} ); Теперь, нажав на первое поле или перейдя к нему с помощью клавиши Tab из другого поля, отобразится сообщение:
Вызван обработчик `focus`.
Мы можем вызвать событие, когда щелкнут по другому элементу:
$( "#other" ).on( "click", function() {
$( "#target" ).trigger( "focus" );
} ); После выполнения этого кода нажатия на Спровоцировать обработчик также отобразят сообщение.
Событие focus не распространяется. С версии 1.4.2 jQuery обходит это ограничение, отображая focus в методах делегирования событий в событии focusin.
Родное событие focus асинхронно во всех версиях IE, в отличие от других браузеров. Чтобы избежать проблем, связанных с этим расхождением, начиная с jQuery 3.7.0, jQuery использует focusin в качестве родного события для focus в IE.
Примеры:
Запустить фокус.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>on demo</title>
<style>
span {
display: none;
}
</style>
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
</head>
<body>
<p><input type="text"> <span>focus fire</span></p>
<p><input type="password"> <span>focus fire</span></p>
<script>
$( "input" ).on( "focus", function() {
$( this ).next( "span" ).css( "display", "inline" ).fadeOut( 1000 );
} );
</script>
</body>
</html> Демо:
Чтобы предотвратить ввод в текстовые поля, попробуйте:
$( "input[type=text]" ).on( "focus", function() {
$( this ).trigger( "blur" );
} ); Чтобы сфокусироваться на поле ввода логина с id 'login' при запуске страницы, попробуйте:
$( function() {
$( "#login" ).trigger( "focus" );
} ); .trigger( "focus" )Возвращает: jQuery
Описание: Вызывает событие "focus" на элементе.
-
версия добавлена: 1.0.trigger( "focus" )
- "focus"Тип: строкаСтрока
"focus".
-
См. описание для .on( "focus", ... ).
