tabindex
Атрибут явно визначає порядок навігації для форматується елементів ( як правило , посилання і керуючі елементи форми) в межах сторінки. Він також може бути використаний для визначення того, чи мають елементи бути сфокусованими чи ні.
[Обидва] tabindex="0"
і tabindex="-1"
мають особливе значення та забезпечують чітке функціонування в HTML. Значення 0
вказує на те, що елемент слід розміщувати в порядку навігації за замовчуванням. Це дозволяє елементи, які з самого початку не фокусируемое (такі , як <div>
, <span>
, і <p>
) , щоб отримати фокус клавіатури. Звичайно, зазвичай слід використовувати посилання та елементи керування формою для всіх інтерактивних елементів, але це дозволяє іншим елементам бути фокусованими та викликати взаємодію.
tabindex="-1"
Значення видаляє елемент з потоку навігації за замовчуванням (тобто, користувач не може вкладка до нього), але він дозволяє отримати програмну спрямованість , тобто фокус може бути встановлений на нього за посиланням або з допомогою сценаріїв. ** Це може бути дуже корисно для елементів, на які не слід вкладати вкладки, але для яких, можливо, потрібно встановити фокус .
Хорошим прикладом є модальне діалогове вікно - при відкритті фокус повинен бути встановлений на діалогове вікно, щоб програма зчитування з екрану розпочала читання, а клавіатура розпочала навігацію в діалоговому вікні. Оскільки <div>
за замовчуванням діалогове вікно (можливо, лише елемент) не tabindex="-1"
фокусується , присвоєння йому дозволяє встановити фокус на нього за допомогою сценаріїв, коли він представлений.
Значення -1
також може бути корисним у складних віджетах та меню, які використовують клавіші зі стрілками або інші комбінації клавіш, щоб забезпечити можливість переміщення лише одним елементом у віджеті за допомогою клавіші табуляції, але все ж дозволяють встановлювати фокус на інших компонентах віджета.