1

我有 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');
}
4

2 回答 2

3

我猜你想要主 nee > 所有 sub 的 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 的代码并确定是否选中了 jQuery 对象中的所有复选框,返回为布尔值

$('.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');
    }
});
于 2012-12-04T14:18:09.897 回答
0

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

于 2012-12-04T14:13:25.640 回答