html - 使用单选按钮组中断键盘焦点

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>

为什么我不能在单选按钮之间切换？这个问题似乎是因为它们都具有相同的名称属性，但就可访问性而言，这对我来说似乎相当违反直觉。为什么焦点状态只应用于一个？这是因为该组被视为单个元素吗？访问 key 是这里唯一的非 Javascript 解决方案吗？

Answer 1

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