Урок 47 із 104
45%
← Назад

Гарячі клавіші в HTML

Вивчаємо атрибут accesskey для створення швидкого доступу до елементів форми за допомогою клавіатури.

Гарячі клавіші в HTML

Атрибут accesskey дозволяє призначити елементу власну гарячу клавішу. Користувач може швидко перейти до цього елемента за допомогою клавіатури.

  • accesskey задається у вигляді однієї клавіші.
  • Після натискання спеціальної комбінації клавіш браузер переводить фокус на елемент.
  • Комбінація залежить від операційної системи.

Приклад використання accesskey

<input accesskey="1">

<input accesskey="2">

<input accesskey="3">

Як працюють гарячі клавіші

  • Windows: Alt + клавіша (у деяких браузерах Alt + Shift + клавіша).
  • macOS: Control + Option + клавіша.
  • Після активації елемент отримує фокус.
❗ Важливо:

accesskey може покращити швидкість роботи з формами, але не варто призначати багато гарячих клавіш — вони можуть конфліктувати з командами браузера.

Практичне завдання

📌 Завдання:
  1. №1. Є три input без атрибутів.
  2. №2. Додайте кожному свою гарячу клавішу.
  3. №3. Перевірте перехід між полями за допомогою клавіатури.
<!-- Початковий код -->

<input>

<input>

<input>
💡 Показати підказку

Для кожного input додайте різне значення accesskey, наприклад 1, 2 і 3.

✅ Показати відповідь
<input accesskey="1">

<input accesskey="2">

<input accesskey="3">