JQUERY 2组带标签的单选按钮 - 隐藏的单选按钮 - 1个选中1未被选中

Question

我有两组单选按钮。我们的想法是使用标签图像并隐藏单选按钮。单击图像时，应选择单选按钮。它适用于第一组，但不适用于第二组。我注释掉了隐藏单选按钮的css，这样你就可以看到第二组中的单选按钮在第一组中点击标签时没有被选中。

这是我的代码：

http://jsfiddle.net/flaming_nonsense/rSBPJ/

任何帮助将不胜感激！

Answer 1

标记是罪魁祸首：

• ID必须是唯一的
• 广播组必须具有唯一的name属性

 <div id="sites2">
    <input type="radio" name="site2" id="so2" value="stackoverflow" /><label for="so2"><img src="http://sstatic.net/stackoverflow/img/favicon.ico" alt="Stack Overflow" /></label>
    <input type="radio" name="site2" id="sf2" value="serverfault" /><label for="sf2"><img src="http://sstatic.net/serverfault/img/favicon.ico"alt="Server Fault" /></label>
    <input type="radio" name="site2" id="su2" value="superuser" /><label for="su2"><img src="http://sstatic.net/superuser/img/favicon.ico" alt="Super User" /></label>
</div>

http://jsfiddle.net/rSBPJ/2/

Answer 2

元素的ID应该是唯一的。所以改变你的HTML如下

请参阅以下链接http://jsfiddle.net/bCLJZ/

Answer 3

问题是您为第二组的无线电输入提供了与第一组的无线电输入相同的ID。

您必须为第二组中的无线电输入提供不同的ID。