取消选中其他框时取消选中答案

【问题标题】：Remove check when other boxes are unchecked取消选中其他框时取消选中
【发布时间】：2012-12-04 13:46:10
【问题描述】：

我有 2 个主要复选框“ja”和“nee”。当这些复选框之一被选中时，它会打开一个包含 1 个或多个复选框的子菜单。这些子复选框也是“ja”和“nee”，并响应主复选框中的选择。我遇到的问题是用户可以在主复选框中选择“nee”，然后将所有子复选框更改为“ja”，但主复选框保持在“nee”，但它必须切换到“ja”复选框。

我已经做到了，所以问题只有 2 个复选框，并且只有在它们上才能有一个选中的属性，并且子复选框位于一个名为“子菜单”的 div 类中。

我认为解决此问题的方法是检查子菜单中是否选中了任何“nee”类子复选框。如果它是主复选框，则保留在“nee”，否则从“nee”主复选框中删除选中的属性并将其切换到“ja”复选框。但显然我不知道该怎么做。

我做了一个小的 jsFiddle 来展示这个项目：http://jsfiddle.net/B2zs5/

<div>
<p>Heb je DigiD?</p>
                <div class="antwoorden">
                    <input id="ja" type="checkbox" value="ja" class="sub_antwoord ja"/><label for="ja">Ja</label>
                    <input id="nee" type="checkbox" value="nee" class="sub_antwoord nee"/><label for="nee">Nee</label> 
                    <div class="extra_info">?
                        <div class="extra_info_popup">
                            Hidden tekst
                        </div>
                    </div>
                </div>
            </div>

这是 jQuery 代码

    $('.open_sub_ja').click(function () {
    $(this).parents('.container_vragen').find('.ja').attr('checked', this.checked);
    $(this).parents('.container_vragen').find('.nee').removeAttr('checked');
});

$('.open_sub_nee').click(function () {
    $(this).parents('.container_vragen').find('.ja').removeAttr('checked');
    $(this).parents('.container_vragen').find('.nee').attr('checked', this.checked);
});

    $('.ja').click(function () {
        $(this).parents('.antwoorden').find('.ja').attr('checked', this.checked);
        $(this).parents('.antwoorden').find('.nee').removeAttr('checked');
    });

    $('.nee').click(function () {
        $(this).parents('.antwoorden').find('.ja').removeAttr('checked');
        $(this).parents('.antwoorden').find('.nee').attr('checked', this.checked);
    });

如果我猜是这样的话，

  if('.nee'.attr('checked')) {
    // do nothing
} 
else {
    $('.open_sub_nee').removeAttr('checked');
    $('.open_sub_ja').attr('checked');
}

【问题讨论】：

如果子选项之一被勾选为是，其余为否，会发生什么？
好点，对于用户交互，应该可以将所有子选项从 yes 更改为 no（反之亦然）尽管我不认为会发生这种情况。

标签： jquery checkbox

【解决方案1】：

我猜你想要 main nee > all sub's ja > 将 main 设置为 ja，反之亦然，以便在 1 个或多个 sub 是 nee 时将 main ja 更改为 nee。

第二点很简单：

$('.nee').click(function () {
    $(this).parents('.antwoorden').find('.ja').removeAttr('checked');
    $(this).parents('.antwoorden').find('.nee').attr('checked', this.checked);

    $(this).parents('.container_vragen').find('.open_sub_ja').removeAttr('checked');
    $(this).parents('.container_vragen').find('.open_sub_nee').attr('checked', this.checked);
});

它似乎已将我的编辑保存在http://jsfiddle.net/B2zs5/2/

子菜单中的所有复选框到 ja 将主 nee 更改为 ja： http://jsfiddle.net/B2zs5/5/ - 我使用了 Teun 的代码和 Determine if all checkboxes within jQuery object are checked, return as boolean

$('.ja').click(function () {
    $(this).parents('.antwoorden').find('.ja').attr('checked', this.checked);
    $(this).parents('.antwoorden').find('.nee').removeAttr('checked');

    $group1 = $(this).parents('.submenu').find('.ja');
    if( $group1.filter(':not(:checked)').length === 0){
        //ALL ja checkboxes in submenu checked
        $(this).parents('.container_vragen').find('.open_sub_ja').attr('checked', this.checked);
        $(this).parents('.container_vragen').find('.open_sub_nee').removeAttr('checked');
    }
});

【讨论】：

理想情况下，您可以在一个单独的函数中使用交换标记，因为它被重复使用

【解决方案2】：

编辑了你的小提琴，添加了一个检查.. 这将禁用对 uncheck 的检查，可以在此处找到添加 /3/ 在您自己的链接后面。不让我发布它：/ 这是你想要的？这样，它会删除所有检查，虽然你比我更了解你的课程，但现在基础知识已经有了..

【讨论】：