JS властивість Event.charCode
Загальний опис
charCode — це властивість об'єкта KeyboardEvent, яка повертає ASCII-код символа, що відповідає натиснутій клавіші на клавіатурі. Властивість використовується для обробки подій клавіатури, коли важливо знати, який саме символ ввів користувач. Вона повертає значення у вигляді цілого числа, що відповідає ASCII-коду введеного символа.
Це працює лише з подіями keypress і може бути застарілим в деяких сучасних браузерах, тому інколи рекомендується використовувати альтернативу - event.key або event.code. Важливо пам'ятати, що charCode повертає код тільки для символів, які можуть бути надруковані, таких як літери, цифри, знаки пунктуації. Наприклад, для натискання клавіші "A" повернеться код 65, який є ASCII-кодом для цього символа.
При використанні цієї властивості треба створити слухач події клавіатури, щоб отримати потрібний код. Далі, значення можна використовувати для різних цілей, як-от перевірка введених символів чи створення інтерактивних застосунків.
document.addEventListener('keypress', function(event) {
console.log(event.charCode); // Виведе ASCII-код символа
});
Важливо відзначити, що charCode працює лише для символів, що відображаються. Інші клавіші, як-от стрілки або функціональні клавіші (наприклад, F1), не мають ASCII-кодів і не будуть оброблені через charCode. Для обробки таких випадків зручно поєднувати charCode з іншими властивостями KeyboardEvent, як-от key або code.
| Порада: | Значення, яке повертається |
| Порада: | Коли обробляєте введення, наприклад, обмежуючи допустимі символи, використовуйте комбінацію |
| Порада: | Враховуйте, що |
Синтаксис
event.charCodeЗначення
Return
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
1 |
1.5 |
1.2 |
12.1 |
12 |
| Переглядач | ||||
|---|---|---|---|---|
37 |
18 |
4 |
1 |
| Переглядач | ||
|---|---|---|
- |
- |
Приклади
Цей код працює таким чином: коли користувач вводить символ у текстове поле, подія keypress спрацьовує та використовує event.charCode, щоб відобразити код введеного символу в реальному часі.
Тут перевіряється, чи натиснута велика літера. Це може бути корисно для спеціальних полів введення, де важливо розрізняти малі і великі літери, наприклад, при перевірці пароля або введенні спеціального коду.
document.addEventListener('keypress', function(event) {
if (event.charCode >= 65 && event.charCode <= 90) {
console.log("Ви ввели велику літеру: " + String.fromCharCode(event.charCode));
}
});Цей код допомагає визначити, коли користувач натискає клавішу Enter, що зручно для обробки підтвердження форми чи відправлення команди.
document.addEventListener('keypress', function(event) {
if (event.charCode === 13) { // Перевірка на Enter
console.log("Натиснуто Enter");
}
});