键盘焦点与单选按钮组打破 [英] Keyboard Focus Breaking with Radio Button Group

问题描述

这似乎很简单，但这对我来说有点头疼。给定以下（有效的xhtml过渡）代码：

 < form action =weird.html> 
 
< label for =test1> T1< / label> 
< input type =radioid =test1name =testvalue =1/> 
 
< label for =test2> T2< / label> 
< input type =radioid =test2name =testvalue =2/> 
 
< label for =test3> T3< / label> 
< input type =radioid =test3name =testvalue =3/> 
 
< label for =test4> T4< / label> 
< input type =radioid =test4name =testvalue =4/> 
 
< label for =test5> T5< / label> 
< input type =radioid =test5name =testvalue =5/> 
 
< / form> 
  

为什么我无法在单选按钮之间切换？这个问题似乎是因为它们都具有相同的名称属性，但就可访问性而言，这似乎与我相反。为什么焦点状态只适用于一个？这是因为该团队被视为一个单一的元素？访问键是唯一的非Javascript解决方案吗？

解决方案

您实际上使用箭头键在单选按钮内移动，因为你说，他们被视为一个单一的元素。这是正常的行为。

It seems simple, but this has been a bit of a headscratcher for me. Given the following (valid xhtml transitional) code:

<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>

Why is it that I can't tab between radio buttons? This issue seems to be because they all have the same name attribute, but that seems rather counter-intuitive to me as far as accesbility goes. Why does the focus state only get applied to one? Is this because the group is treated as a single element? Are access keys the only non-Javascript solution here?

解决方案

You actually use the arrow keys to move within the radio buttons because as you said, they are treated as a single element. This is normal behavior.

这篇关于键盘焦点与单选按钮组打破的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！