0

我有 2 组 raido 按钮，它们有不同的唯一 ID，如何使它们只能为每组选择一个。谢谢

<group>
<input type="radio" id="u1"/>1
<input type="radio" id="u2"/>2
<input type="radio" id="u3"/>3
</div >
</group>


<group>
<input type="radio" id="T1"/>4
<input type="radio" id="T2"/>5
<input type="radio" id="T3"/>6
</group>

http://jsfiddle.net/pZdWu/

我不想改html，只想用jQuery来实现

4

3 回答 3

4

如果你真的必须使用现有的 HTML，那么我建议通过 jQuery 修改 HTML 以简单地使用无线电输入的默认功能：

​$('group').each(
    function(i,e){
        $(e).find('input:radio').attr('name', 'group' + i);
    });​​​​​

JS 小提琴演示。

参考：

于 2012-10-28T20:43:37.857 回答
1

使用 name 属性为组中的每个项目指定一个通用名称.....

<input type="radio" name="group1" id="u1"/>1
<input type="radio" name="group1" id="u2"/>2
<input type="radio" name="group1" id="u3"/>3
于 2012-10-28T20:37:23.740 回答
1

使用 jQuery，您可以使用如下内容：

http://jsfiddle.net/pZdWu/5/

$(document).ready(function () {
    $("input[type=radio]").click(function () {
        var $this = $(this);
        $this.siblings("input[type=radio]").prop("checked", false);
    });
});

但这假设您的 HTML 结构与您提供的完全一样。

如果单选按钮上有任何类型的 HTML 包装，或者以任何方式分组，siblings则无法使用 。您可能必须使用类似的东西：

http://jsfiddle.net/pZdWu/7/

$(document).ready(function () {
    $("input[type=radio]").click(function () {
        var $this = $(this);
        $this.parents("group:first").find("input[type=radio]").not($this).prop("checked", false);
    });
});

并且显然将“组”的使用更改为您实际使用的任何内容（我以为我看到您将原始问题编辑为不使用<group>）。

于 2012-10-28T20:44:36.977 回答