Содержание:
.on( "keydown" [, eventData ], handler )Возвращает: jQuery
Описание: Привязывает обработчик события "keydown".
-
версия добавлена: 1.7.on( "keydown" [, eventData ], handler )
Эта страница описывает событие keydown. Для устаревшего метода .keydown(), см. .keydown().
Событие keydown отправляется элементу, когда пользователь нажимает клавишу на клавиатуре. Если клавиша удерживается, событие отправляется каждый раз, когда операционная система повторяет нажатие клавиши. Его можно привязать к любому элементу, но событие отправляется только элементу, у которого есть фокус. Фокусируемые элементы могут отличаться в разных браузерах, но элементы формы всегда могут получить фокус, поэтому являются разумными кандидатами для этого типа событий.
Например, рассмотрим HTML:
<form> <input id="target" type="text" value="Hello there"> </form> <div id="other"> Trigger the handler </div>
Обработчик события можно привязать к полю ввода:
$( "#target" ).on( "keydown", function() {
alert( "Handler for `keydown` called." );
} ); Теперь, когда курсор находится внутри поля, нажатие клавиши отображает всплывающее окно:
Обработчик `keydown` вызван.
Чтобы вызвать событие вручную, используйте .trigger( "keydown" ):
$( "#other" ).on( "click", function() {
$( "#target" ).trigger( "keydown" );
} ); После выполнения этого кода щелчки по Вызвать обработчик также отобразят сообщение.
Если необходимо поймать нажатия клавиш где угодно (например, для реализации глобальных сочетаний клавиш на странице), полезно привязать это поведение к объекту document. Из-за распространения событий все нажатия клавиш будут передаваться вверх по DOM к объекту document, если явно не будут остановлены.
Чтобы определить, какая клавиша была нажата, проверьте объект события, который передаётся обработчику функции. Хотя браузеры используют различные свойства для хранения этой информации, jQuery нормализует свойство .which, так что вы можете надёжно использовать его для получения кода клавиши. Этот код соответствует клавише на клавиатуре, включая коды для специальных клавиш, таких как стрелки. Для перехвата фактического ввода текста .keypress() может быть лучшим выбором.
Пример:
Показать объект события для обработчика keydown при нажатии клавиши в поле ввода.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>on demo</title>
<style>
fieldset {
margin-bottom: 1em;
}
input {
display: block;
margin-bottom: .25em;
}
#print-output {
width: 100%;
}
.print-output-line {
white-space: pre;
padding: 5px;
font-family: monaco, monospace;
font-size: .7em;
}
</style>
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
</head>
<body>
<form>
<fieldset>
<label for="target">Type Something:</label>
<input id="target" type="text">
</fieldset>
</form>
<button id="other">
Trigger the handler
</button>
<script type="text/javascript" src="/resources/events.js"></script>
<script>
var xTriggered = 0;
$( "#target" ).on( "keydown", function( event ) {
if ( event.which == 13 ) {
event.preventDefault();
}
xTriggered++;
var msg = "Handler for `keydown` called " + xTriggered + " time(s).";
$.print( msg, "html" );
$.print( event );
} );
$( "#other" ).on( "click", function() {
$( "#target" ).trigger( "keydown" );
} );
</script>
</body>
</html> Демо:
.trigger( "keydown" )Возвращает: jQuery
Описание: Вызвать событие "keydown" на элементе.
-
версия добавлена: 1.0.trigger( "keydown" )
- "keydown"Тип: строкаСтрока
"keydown".
-
См. описание для .on( "keydown", ... ).
