Как игнорировать HTML-элемент из tabindex?
Есть ли способ в HTML сказать браузеру не разрешать индексирование вкладок для определенных элементов?
На моей странице есть демонстрация, которая отображается с помощью jQuery, когда вы просматриваете ее, вы получаете много нажатий на вкладки, прежде чем элемент управления вкладками переходит к следующей видимой ссылке на странице, поскольку все объекты, на которые вкладки вкладываются, скрыты для пользователь визуально.
7 ответов
Ты можешь использовать tabindex="-1"
,
Спецификация W3C HTML5 поддерживает отрицательные tabindex
ценности:
Если значение является отрицательным целым числом
Пользовательский агент должен установить флаг фокуса tabindex элемента, но не должен позволять доступ к элементу с использованием последовательной навигации фокуса.
Обратите внимание, что это функция HTML5, которая может не работать со старыми браузерами.
Чтобы соответствовать стандарту W3C HTML 4.01 (с 1999 года), tabindex должен быть положительным.
Не забывайте об этом, хотя tabindex
все в нижнем регистре в спецификациях и в HTML, в Javascript/ DOM это свойство называется tabIndex
,
Не сходите с ума, пытаясь понять, почему ваши программно измененные индексы табуляции вызывают element.tabindex = -1
не работает использование element.tabIndex = -1
,
Если это элементы, естественно, в порядке вкладок, такие как кнопки и привязки, удаление их из порядка вкладок с tabindex=-1 является своего рода запахом доступности. Если они предоставляют дублирующуюся функциональность, удалите их из последовательности вкладок, и подумайте о добавлении aria-hidden=true к этим элементам, чтобы вспомогательные технологии их игнорировали.
Если вы работаете в браузере, который не поддерживает tabindex="-1"
Возможно, вам удастся просто обойтись без того, чтобы дать вещам, которые нужно пропустить, действительно высокий индекс табуляции. Например tabindex="500"
в основном перемещает порядок табуляции объекта в конец страницы.
Я сделал это для длинной формы ввода данных с кнопкой, брошенной в середине. Это не кнопка, которую люди нажимают очень часто, поэтому я не хотел, чтобы они случайно нажимали на нее и нажимали ввод. disabled
не будет работать, потому что это кнопка.
Просто добавьте атрибут disabled
к элементу (или используйте jQuery, чтобы сделать это за вас). Отключено предотвращает фокусировку или выбор входа.
Способ сделать это, добавив tabindex="-1"
, Добавляя это к определенному элементу, он становится недоступным при навигации по клавиатуре. Здесь есть отличная статья, которая поможет вам лучше понять tabindex.
Такой взлом, как "tabIndex=-1", не работает для меня с Chrome v53.
Это работает для Chrome и большинства браузеров:
element.removeAttribute('tabindex');