Do czego służy tabindex = „- 1” w programie bootstrap

Jaki jest tabindexatrybut w Bootstrap 3?

Jego dokumentacja nic o nich nie mówi, chociaż używają ich praktycznie we wszystkich modach.

Znalazłem to tylko w odniesieniu do jego zastosowania, co tak naprawdę niewiele mówi

Dostępne podpowiedzi dla użytkowników klawiatury i technologii wspomagających

W przypadku użytkowników korzystających z klawiatury, aw szczególności użytkowników technologii wspomagających, należy dodawać podpowiedzi tylko do elementów, na które można ustawić fokus z klawiatury, takich jak łącza, kontrolki formularzy lub dowolny dowolny element z atrybutem tabindex = „0”.

I dowiedziałem się, że nie mogę nacisnąć, escaby ukryć modal, jeśli tabindexatrybut nie jest-1 .

• Zamykanie modalne po naciśnięciu escklawisza (z tabindex)
• Modal nie zamyka się po naciśnięciu escklawisza (bez tabindex)

tabindexAtrybut jednoznacznie określa kolejność nawigacyjnego elementów aktywowana (zazwyczaj łączy i elementów postać) w stronę. Można go również użyć do określenia, czy elementy powinny być fokusowane, czy nie.

[Obie] tabindex="0"i tabindex="-1"mają specjalne znaczenie i zapewniają odrębną funkcjonalność w HTML. Wartość 0wskazuje, że element powinien zostać umieszczony w domyślnej kolejności nawigacji. Pozwala to elementy, które nie są natywnie aktywowana (takich jak <div>, <span>i <p>) przyjmowanie klawiaturę. Oczywiście należy generalnie używać linków i kontrolek formularzy dla wszystkich elementów interaktywnych, ale pozwala to na skupienie się na innych elementach i wywołanie interakcji.

tabindex="-1"Wartość usuwa element z domyślnego przepływu nawigacji (czyli użytkownik nie może Zakładka do niego), ale pozwala na odbieranie programowy ostrości , czyli ostrość można ustawić na nim z linkiem lub skryptów. ** To może być bardzo przydatne w przypadku elementów, które nie powinny być umieszczane na kartach, ale mogą wymagać ustawienia na nich fokusu .

Dobrym przykładem jest modalne okno dialogowe - po otwarciu należy ustawić fokus na okno dialogowe, aby program udźwiękawiający zaczął czytać, a klawiatura poruszać się po oknie. Ponieważ okno dialogowe (prawdopodobnie tylko <div>element) nie jest domyślnie aktywne, przypisanie go tabindex="-1"umożliwia ustawienie fokusu za pomocą skryptów, gdy jest prezentowane.

Wartość of -1może być również przydatna w złożonych widżetach i menu, które wykorzystują klawisze strzałek lub inne klawisze skrótów, aby zapewnić, że tylko po jednym elemencie widżetu można poruszać się za pomocą klawisza Tab, ale nadal umożliwia ustawienie fokusu na innych składnikach widżetu.

Źródło: http://webaim.org/techniques/keyboard/tabindex

Dlatego potrzebujesz tabindex="-1"modalu <div>, aby użytkownicy mogli uzyskać dostęp do popularnych skrótów myszy i klawiatury. Mam nadzieję, że to pomoże.

Tabindex atrybut jest związana z HTML , to nie jest specyficzne dla startowej.

Ta właściwość jest odpowiedzialna za wskazanie, czy element jest osiągalny za pomocą nawigacji klawiaturowej.

Musisz zwrócić uwagę na trzy różne scenariusze:

1. Przy dodawaniu tabindex = "0"do elementu oznacza to, że jest on osiągalny przez nawigację klawiaturową, ale kolejność jest określona przez kolejność źródeł dokumentów.

2. Podczas dodawania wartość dodatnią atrybutowi tabindex (na przykład tabindex = "1", tabindex = "2"), elementy te są osiągalne nawigacji klawiatury, a kolejność jest określona przez wartość atrybutu.

3. Po dodaniu ujemną wartość do TabIndex (zazwyczaj tabindex="-1") oznacza, że element jest nieosiągalny przez nawigacji klawiatury, ale może być skupiona ostrość za pomocą funkcji w JS.