2013-01-14 12 views
36

Mam listę przycisków radiowych. kiedy przechodzę przez nie, wydaje się, że tylko pierwszy przycisk radiowy lub wybrany, zostanie wybrany, reszta przycisków radiowych zostanie pominięta. checkbox nie miał tego problemu.Czy możesz przechodzić przez wszystkie przyciski opcji?

http://jsfiddle.net/2Bd32/

mam trudny czas, aby wyjaśnić do mojego QA to nie jest błąd. Czy ktoś może mi wyjaśnić, dlaczego tak się dzieje.

Soccer: <input type="checkbox" name="sports" value="soccer" tabindex="1" /><br /> 
Football: <input type="checkbox" name="sports" value="football" tabindex="2" /><br /> 

<input type="radio" name="num" value="3" tabindex="3">3<br> 
<input type="radio" name="num" value="4" tabindex="4">4<br> 
<input type="radio" name="num" value="5" tabindex="5">5<br> 
<input type="radio" name="num" value="6" tabindex="6">6<br> 
<input type="radio" name="num" value="7" tabindex="7">7<br> 

Baseball: <input type="checkbox" name="sports" value="baseball" tabindex="8" /><br /> 
Basketball: <input type="checkbox" name="sports" value="basketball" tabindex="9" /> 
+0

Wydaje mi się, że korzystasz z przeglądarki. Z jakiej przeglądarki korzystasz? Czy próbowałeś go w innych przeglądarkach? –

+0

wypróbowany firefox, ie9 i chrome – qinking126

+0

Pamiętaj, że "poprawianie" domyślnego zachowania prowadzi częściej niż zwykłe błędy .... jeśli płacisz za godzinę, idź do niego, jeśli jesteś w ustalonym czasie/projekcie budżetu bądź mądry ... – rene

Odpowiedz

65

Możesz zacytować W3C jako źródło, here i here.

Zasadniczo przycisk opcji jest grupą, która działa jako pojedynczy element, ponieważ zachowuje tylko jedną wartość. Przechodzenie do grupy radiowej powoduje przejście do pierwszego elementu, a następnie za pomocą klawiszy strzałek nawigowanych w grupie.

  • Ostrość można przenieść do grupy radiowej poprzez:
    • kartę klucz
    • Access Key lub pamięciowy kierowania etykietę
    • aktywacji etykiety (poprzez wspomagających mechanizm Technology)
  • Klawisz tabulatora przenosi fokus pomiędzy przyciskami grupy i innymi widżetami.
  • Kiedy skupiamy się na grupy i gdy nie zostanie wybrany przycisk radiowy:
    • klawisza Tab przenosi prasowe skupić do pierwszego przycisku radiowego w grupie, ale nie wybierz przycisk radiowy .
    • Shift + klawisz klawisza Tab przenosi fokus do ostatniego przycisku radia w grupie, ale nie wybiera przycisku opcji.
  • gdy fokus przechodzi do grupy, w której znajduje się przycisk radiowy wybrany, naciśnięcie klawiszy Tab i Shift + Tab przenieść fokus do radia przycisku, który jest zaznaczone.
  • Klawisze strzałek w górę i w dół przenoszą ostrość i wybór .
    • Klawisz strzałki w górę przesuwa ostrość, a wybiera do przodu za pomocą przycisków radiowych w grupie. Jeśli pierwszy przycisk radiowy ma ustawioną ostrość, wówczas fokus i wybór przesuwają się w stronę ostatniego przycisku radiowego w grupie.
    • Naciśnij klawisz strzałek w dół, aby przesunąć fokus i wybierz wstecz za pomocą przycisków radiowych w grupie. Jeśli ostatni przycisk radiowy z ostrzeżeniem jest ustawiony na , wówczas ostrość i wybór zostaną przeniesione do pierwszego przycisku radiowego w grupie. * Naciskaj klawisz spacji, aby sprawdzić przycisk radiowy , który jest aktualnie aktywny.
  • Po ponownym wejściu do grupy, ostrość powraca do punktu poprzedniego ogniskowania (pozycja z zestawem wyboru).
  • Naciśnięcie klawisza Tab zamyka grupę i przenosi fokus do następnej kontrolki formularza.
  • Naciśnięcie klawisza Shift + Tab powoduje wyjście z grupy i przeniesienie fokusu do poprzedniego formantu formularza .
+1

Napisałem [wtyczkę jQuery] (https://gist.github.com/jonathanconway/899a0856a8b16245cca3) i [dyrektywę kątową] (https://gist.github.com/jonathanconway/ ae2739de99c52c971cbb), który powinien dowolnie ustawiać dowolny zestaw przycisków radiowych za pomocą TAB. Może być użyteczny dla kogoś. :) – Jonathan

+0

czy można zaznaczyć grupę radiową, gdy nie wybrano jeszcze radia z grupy? –

9

przyciski radiowe z jednym nazwy jest jak pojedynczej kontroli (jak wejście lub wybierz), można zmienić go cenią za pomocą klawiszy strzałek, klawisz TAB przenosi fokus do innego formantu.

1

Jeśli używasz angularjs można sterować przełącznik bezpośrednio ng-model stosując tę ​​samą ng-model i usuwanie name.

<input type="radio" value="0" ng-model="status"> 
<input type="radio" value="1" ng-model="status"> 

Kolejną zaletą przy naciśnięciu klawisza jest to, że można najpierw ustawić ostrość za pomocą przycisku radiowego, nie wybierając go. Możesz następnie wybrać, naciskając space.

Powiązane problemy