1

「ja」と「nee」の 2 つのメイン チェックボックスがあります。これらのチェックボックスの 1 つがチェックされると、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 > すべてのサブの ja > メインを ja に設定し、その逆で、1 つ以上のサブが nee の場合にメイン ja を nee に変更する必要があると思います。

2 番目のビットは簡単です。 

$('.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 のコードを使用し、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 に答える