取消选中其他框时删除检查

时间:2012-12-04 13:46:10

标签: jquery checkbox

我有两个主要的复选框“ja”和“nee”。选中其中一个复选框后,将打开一个包含一个或多个复选框的子菜单。这些子检查框也是“ja”和“nee”,并响应maincheckbox中的选择。我遇到的问题是用户可以在主复选框中选择“nee”,然后将所有子检查框更改为“ja”,然后maincheckbox保持“nee”,但必须切换到“ja”复选框。

我已经做到这样,问题只有2个复选框,只有它们可以有一个checked属性,子复选框位于一个名为“子菜单”的div类中。

我认为这个问题的解决方案是检查子菜单中是否检查了任何“nee”类子检查框。如果它是maincheckbox保持“nee”,则从“nee”主检查框中删除checked属性并将其切换到“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');
}

2 个答案:

答案 0 :(得分:3)

我猜你想要主要的&gt;所有子的ja&gt;将main设置为ja,反之亦然,当1个或更多sub为nee时,将主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子菜单中的所有复选框都将主要内容更改为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');
    }
});

答案 1 :(得分:0)

编辑你的小提琴,加了一张支票给它.. 这将禁用检查取消选中它可以在这里添加/ 3 /在你自己的链接后面。不要让我发布它:/ 这是你想要的? 这样它会删除所有的检查,但是你比我更了解你的课程,但现在基础已经存在......