JS властивість Event.location
Загальний опис
location — це властивість об'єкта KeyboardEvent, яка визначає фізичне розташування натиснутої клавіші на клавіатурі. Вона повертає числове значення, яке описує, на якій частині клавіатури натиснута клавіша. Властивість корисна для визначення конкретної клавіші, коли є кілька варіантів тієї самої клавіші, таких як Shift, Alt, або Control, розташованих як зліва, так і справа. Наприклад, лівий і правий Shift мають однаковий код, але різні значення location.
Значення location можуть бути наступними:
0(DOM_KEY_LOCATION_STANDARD): клавіша є частиною основної секції клавіатури, як-от цифри або букви.1(DOM_KEY_LOCATION_LEFT): клавіша на лівій частині клавіатури (наприклад, лівийShift).2(DOM_KEY_LOCATION_RIGHT): клавіша на правій частині клавіатури (наприклад, правийShift).3(DOM_KEY_LOCATION_NUMPAD): клавіша на цифровій клавіатурі (наприклад, цифри на цифровому блоці).
Властивість location дозволяє реалізувати специфічні функціональні можливості для клавіш залежно від їхнього розташування. Наприклад, можна використовувати її для розрізнення лівого і правого Control, щоб надати їм різні функції.
document.addEventListener('keydown', (event) => {
if (event.location === 1) {
console.log('Ліва клавіша натиснута');
} else if (event.location === 2) {
console.log('Права клавіша натиснута');
}
});
Цей приклад відстежує, з якого боку клавіатури була натиснута клавіша Shift, Control або інші модифікатори, надаючи більше можливостей для управління взаємодією з клавіатурою. За допомогою цієї властивості ви можете реалізувати кастомні скорочення, враховуючи сторону натискання клавіші.
- Порада
-
Якщо ви розробляєте гру або програму з важливою підтримкою клавіатури, використовуйте
автор: Bondlocationдля управління цифровою клавіатурою окремо від основної клавіатури. Це дозволить вам враховувати специфічні цифрові клавіші та не змішувати їх з іншими. - Порада
-
Розрізнення лівої та правої клавіш може бути корисним для додатків із глибокими можливостями налаштування. Наприклад, можна призначити різні команди для лівого та правого
автор: BondAlt, створивши окремі шляхи обробки для обох варіантів. - Порада
-
автор: Bondlocationне завжди повертає значення для кожної клавіші. Наприклад, звичайні букви та цифри повернуть значення0. Перевіряйте цю властивість лише для тих клавіш, які можуть мати відмінності в розташуванні (модифікатори та цифровий блок).
Синтаксис
event.locationПереглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 144 | — | — | 128 | 144 | — |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| — | 144 | — | — |
Приклади
+ запропонувати свій приклад у пісочниці
У цьому прикладі відстежується, чи була натиснута цифра з цифрового блоку або основної клавіатури. Це може бути корисним для касових систем або додатків, які обробляють цифровий блок і основну клавіатуру окремо.
document.addEventListener('keydown', (event) => {
if (event.key >= '0' && event.key <= '9' && event.location === 3) {
console.log('Цифра з цифрового блоку:', event.key);
} else if (event.key >= '0' && event.key <= '9') {
console.log('Цифра з основної клавіатури:', event.key);
}
});Цей код відстежує натискання клавіш Shift, Alt та Control, використовуючи location, щоб відрізняти ліві, праві та центральні клавіші. Повідомлення з вказівкою на сторону клавіші виводиться в елементі output, дозволяючи користувачу побачити результат. Це корисно для розробки інтерфейсів, де ліві та праві модифікатори мають різні функції.
Цей приклад показує, як можна реалізувати різні функції залежно від того, з якої сторони натиснуто клавішу Shift. Така логіка корисна для додатків, які використовують різні команди для лівого і правого Shift.
document.addEventListener('keydown', (event) => {
if (event.key === 'Shift' && event.location === 1) {
console.log('Натиснуто лівий Shift: активація функції A.');
} else if (event.key === 'Shift' && event.location === 2) {
console.log('Натиснуто правий Shift: активація функції B.');
}
});Коментарі
Коментарів ще немає — будьте першим!