Скрипт перехвата нажатий нескольких клавиш на JavaScript
Данная JavaScript функция позволяет перехватывать одновременное нажатие нескольких клавиши на странице. Использовать это можно, например, для быстрого перехода по ссылкам на сайте или в редакторе текста - для сохранения текста, его стилизации в редактируемой области и т.д.
Код скрипта упрощен насколько это возможно, для того чтобы Вы могли понять суть того, как можно перехватывать нажатие сразу нескольких клавиш на странице с помощью JavaScript. Далее вы уже самостоятельно можете дополнить его необходимой функциональностью.
Код:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Скрипт перехвата нажатий нескольких клавиш на JavaScript</title>
</head>
<body>
<script>
/**
* Данная функция привязывает действие callback к нажатию
* клавиш Cntrl + Клавиша (targetKey)
*
*/
function controlPlusKey( targetKey, callback )
{
// добавляем событие нажатия клавиш на документ
document.addEventListener('keydown', event => {
// если нажаты клавишы Cntrl и targetKey
if( event.ctrlKey && event.which == targetKey.charCodeAt(0) ) {
// запрещаем действие по умолчанию
event.preventDefault();
// вызываем наше действие
callback();
}
}, false);
}
// используем так
controlPlusKey('D', () => console.log('Нажаты клавиши Cntrl + D'));
controlPlusKey('Z', () => console.log('Нажаты клавиши Cntrl + Z'));
controlPlusKey('F', () => console.log('Нажаты клавиши Cntrl + F'));
</script>
</body>
</html>
-
Создано 12.09.2019 13:59:59
-
Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.