1 
1）当我点击任何复选框时，
  a) 我想在同一个 div 中选择收音机
  b) 使用复选框取消选择其他收音机。

2）当我点击收音机时，
  a) 选中同一 div 中的所有复选框。
  b) 取消选中其他收音机

3）有没有办法让父母没有第一个父母div？

我怎样才能做到这一点？

<div class="topDiv">
    <div class="repeaterDiv"><input type="radio" id="rpt_01_rb" />
        <input type="checkbox" id="rpt_01_cb1" />
        <input type="checkbox" id="rpt_01_cb2" />
        <input type="checkbox" id="rpt_01_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_02_rb" />
        <input type="checkbox" id="rpt_02_cb1" />
        <input type="checkbox" id="rpt_02_cb2" />
        <input type="checkbox" id="rpt_02_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_03_rb" />
        <input type="checkbox" id="rpt_03_cb1" />
        <input type="checkbox" id="rpt_04_cb2" />
        <input type="checkbox" id="rpt_05_cb3" />
    </div>
</div>
4

3 回答 3

2

这应该比 DrJokepu 更有效：

$(function() {
    $('.repeaterDiv>:radio').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).siblings(':checkbox').attr('checked','checked');
    });

    $('.repeaterDiv>:checkbox').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).attr('checked','checked').siblings(':radio').attr('checked','checked');
    });
});

作为旁注，您应该确保单选按钮都具有相同的名称，以便符合标准...

如果有一些奇怪的原因导致您不能这样做，您可以将复选框绑定块的最后一行（尽管可能很难看）更改为：

$(this)
    .attr('checked','checked')
    .parent().siblings('.repeaterDiv').find(':radio')
    .removeAttr('checked');

    // I prefer to break the chain here but...
    // you could continue the above chain by doing: 
    // '.end().end().end().siblings(':radio').attr('checked','checked');'

$(this).siblings(':radio').attr('checked','checked');
于 2009-05-15T17:47:40.447 回答
0 
// when a radio is clicked, unselect any checkboxes in other groups
$('div.topDiv input[type=radio]').click(function() {
    $('div.topDiv div.repeaterDiv').not($(this).parent(".repeaterDiv")).children("input[type=checkbox]").attr('checked', '');
});

// when a checkbox is checked, and it's radio isn't, "click" its radio
// which in turn unchecks other boxes using event defined above
$('div.topDiv input[type=checkbox]').click(function() {
    if (!$(this).siblings('input[type=radio]').attr('checked')) {
        $(this).siblings('input[type=radio]').trigger('click');
    }
});

这将取消选中任何其他单选选项检查组中的复选框。与其他人相同的通知 RE：需要通用名称的单选选项。

于 2009-05-15T18:10:49.113 回答
-1

确保所有单选按钮共享相同的名称：

<input type="radio" id="rpt_01_rb" name="rpt_rb" />
<input type="radio" id="rpt_02_rb" name="rpt_rb" />
// etc...

然后尝试以下代码（我没有测试过）：

$('div.repeaterDiv>input[type=checkbox]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=radio]:first').attr('checked', 'checked');
    });
});

$('div.repeaterDiv>input[type=radio]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=checkbox]').attr('checked', 'checked');
    });
});

这里会发生什么？

第一部分循环遍历 div 中的复选框，并为每个复选框附加一个事件处理程序。此事件处理程序检查同一 div 中的单选按钮。

同样，第二部分循环遍历 div 中的单选按钮，附加一个事件处理程序，该处理程序检查同一 div 中的所有复选框。

如果您没有忘记确保单选按钮具有相同的名称，则取消选中其他单选按钮应该由浏览器自动完成。

于 2009-05-15T17:29:36.997 回答