키보드 포커스 라디오 버튼 그룹으로 깨기

Question

단순 해 보이지만 이것은 나를 위해 약간의 헤드 스케이터였습니다. 다음과 같은 (유효한 xhtml 전환 코드) :

<form action="weird.html"> 

      <label for="test1">T1</label> 
      <input type="radio" id="test1" name="test" value="1" /> 

      <label for="test2">T2</label> 
      <input type="radio" id="test2" name="test" value="2" /> 

      <label for="test3">T3</label> 
      <input type="radio" id="test3" name="test" value="3" /> 

      <label for="test4">T4</label> 
      <input type="radio" id="test4" name="test" value="4" /> 

      <label for="test5">T5</label> 
      <input type="radio" id="test5" name="test" value="5" /> 

     </form> 

라디오 버튼간에 탭을 사용할 수없는 이유는 무엇입니까? 이 문제는 모두 동일한 이름 속성을 갖고 있기 때문에 가능하지만 accesbility가가는 한 내게는 직관적이지 않습니다. 왜 포커스 상태는 포커스 상태에만 적용됩니까? 이것은 그룹이 단일 요소로 취급되기 때문입니까? 유일한 비 자바 스크립트 솔루션 인 액세스 키가 있습니까?

Answer 1

당신이 말한 것처럼 실제로는 화살표 키를 사용하여 단일 요소로 취급되기 때문에 라디오 단추 안에서 이동하십시오. 이것은 정상적인 동작입니다.

Answer 2

James와 Tatu가 정상이라고 말했듯이 "TABINDEX"를 사용했는지는 모르겠지만 작동 할 수도 있습니다.

<input type="radio" id="test5" name="test" value="5" tabindex="5" /> 

하지만 단일 요소로 처리되기 때문에 작동하지 않을 수 있습니다.

Answer 3

예, 각 라디오 버튼 그룹은 하나의 양식 요소로 처리됩니다. 그룹 요소 사이를 건너 뛰려면 화살표 키를 사용하십시오. 그것은 의미가 있습니다. 10 개의 라디오 버튼을 반쯤 눌러 긴 형식으로 탭하면 10 개의 라디오 옵션을 모두 탭하여 다음 양식 항목으로 이동해야하는 경우 짜증이납니다.

동일한 그룹에 속하지 않은 경우 탭 사이에 탭을 만들 수 있습니다. 아래 예에서 T5는 다른 탭 포커스를 얻습니다.

<form action="weird.html"> 

     <label for="test1">T1</label> 
     <input type="radio" id="test1" name="test" value="1" /> 

     <label for="test2">T2</label> 
     <input type="radio" id="test2" name="test" value="2" /> 

     <label for="test3">T3</label> 
     <input type="radio" id="test3" name="test" value="3" /> 

     <label for="test4">T4</label> 
     <input type="radio" id="test4" name="test" value="4" /> 

     <label for="test5">T5</label> 
     <input type="radio" id="test5" name="test2" value="5" /> 

    </form>