Что такое tabindex= "-1" в bootstrap для

что это tabindex атрибут в Bootstrap 3 для?



его документация ничего не говорит о них, хотя они используют их практически во всех модальностях.



Я только нашел это относительно его использования, что на самом деле не говорит много




доступные подсказки для пользователей клавиатуры и вспомогательных технологий



для пользователей, перемещающихся с помощью клавиатуры, и в частности пользователей вспомогательных технологий, вы должны только добавьте всплывающие подсказки к элементам с фокусировкой на клавиатуре, таким как ссылки, элементы управления формой или любой произвольный элемент с атрибутом tabindex="0".




и я узнал я не могу нажать esc чтобы скрыть модальный, если не -1.



615   2  

2 ответов:

The tabindex атрибут явно определяет порядок навигации для фокусируемых элементов (обычно ссылок и элементов управления формой) на странице. Он также может использоваться для определения того, должны ли элементы быть фокусируемыми или нет.

[оба] tabindex="0" и tabindex="-1" имеют особое значение и обеспечивают отличную функциональность в HTML. Значение 0 указывает, что элемент должен быть размещен в порядке навигации по умолчанию. Это позволяет элементы, которые не являются изначально фокус (например,<div>,<span> и <p>) для получения фокуса клавиатуры. Конечно, обычно следует использовать ссылки и элементы управления формой для всех интерактивных элементов, но это позволяет другим элементам фокусироваться и запускать взаимодействие.

A tabindex="-1" стоимостью удаляет элемент из потока навигации по умолчанию (т. е. пользователь не может вкладывать в него), но это позволяет ему получать программный фокус, то есть фокус может быть установлен на него из ссылки или со скриптами.** Это может быть очень полезно для элементов, которые не должны быть закладки, но это может потребоваться иметь фокус установлен на них.

хорошим примером является модальное диалоговое окно - при открытии, фокус должен быть установлен в диалоговом окне, чтобы программы чтения с экрана начнется чтение и клавиатура начнет навигация в диалоговом окне. Потому что диалог (наверное, просто <div> элемент) не фокусируется по умолчанию, назначение его tabindex="-1" позволяет установить фокус на него с помощью сценариев, когда он представлен.

значение -1 также может быть полезно в сложных виджетов и меню, используйте клавиши со стрелками или другие сочетания клавиш чтобы убедиться, что только один элемент в виджете доступен для навигации с помощью клавиши tab, но все же позволяет установить фокус на другие компоненты в виджете.

источник: http://webaim.org/techniques/keyboard/tabindex

вот почему вам нужно tabindex="-1" на режимной <div>, так что пользователи могут получить доступ к общей мыши и сочетания клавиш. Надеюсь, это поможет.

89  
2015-10-02 20:01:33

The tabindex атрибут ассоциируется с HTML, это не относится к Bootstrap.

это свойство отвечает за указание, если элемент доступен с помощью клавиатуры навигации.

вам нужно обратить внимание на три различных сценария:

  1. при добавлении tabindex = "0" для элемента это означает, что он доступен с помощью клавиатуры навигации, но порядок определяется источником документов порядок.

  2. , когда добавление положительного значения к атрибуту tabindex (например tabindex = "1", tabindex = "2") эти элементы доступны с помощью клавиатуры навигации и порядка определяется значением атрибута.

  3. , когда добавление отрицательного значения в tabindex (обычно tabindex="-1") это означает, что элемент недоступно с помощью клавиатуры навигации.

1  
2018-05-04 12:18:56

Comments

    Ничего не найдено.
Click here to cancel reply.