Tabindex分组单选按钮

时间:2013-08-19 09:18:31

标签: html radio-button tabindex

我需要将tabindex放在分组单选按钮上,以便标签按顺序聚焦每个单选按钮。为此,我只需要使用“tab键”(而不是箭头键),而且,我必须将它们(单选按钮)保存在一个组中。

<input onclick="javascript:showUserName();" name="userSearch" value="UN" type="radio">
<input onclick="javascript:showLoginID();" name="userSearch" value="UL" type="radio">
<input onclick="javascript:showEmployeeID();" name="userSearch" value="EI" type="radio">

问题是tabindex只将选定的单选按钮聚焦在一个组中,然后在后续选项卡上将其转到下一组Html元素,而不是组中的下一个单选按钮。我知道,这是标准的浏览器行为,但有什么方法可以解决我的要求吗?

是否会在我的页面上编写一个JS代码来监视onkeypress事件,以监视选项卡和无线电组组合以明确关注无线电组按钮的一种好方法?

1 个答案:

答案 0 :(得分:1)

您可以将onkeydown绑定到您的输入并检查键代码是否匹配tab按键代码然后实现您自己的行为。

类似的东西:

<input onkeydown="if (event.keyCode==%TABKEYCODE%) handleTabPress(); return false;".... />

在handleTabPress中,您可以实现自己的机制,如果按Tab键会发生什么。您应该将焦点设置在onclick事件中的单选按钮上。