jquery - 特定のdivを非表示にし、div内のすべてのチェックボックスをチェックするJqueryチェックボックス

Question

コードを実行するときにチェックボックスがチェックされないようにするにはどうすればよいですか? 内部にチェックボックスを含むいくつかの div があり、それぞれの内部のチェックボックスをチェックし、同時に特定の div を非表示にしたいのですが、実行するとすべてのチェックボックスがチェックされます:

HTML:

<input type="checkbox" id="hide-and-checked">group 1
<div id="one" class="hide-and-checked">
    <input type="checkbox" class="list_check" value="1">1
    <input type="checkbox" class="list_check" value="2">2
    <input type="checkbox" class="list_check" value="3">3</div>
<br>
<input type="checkbox" id="hide-and-checked">grup 2
<div id="two" class="hide-and-checked">
    <input type="checkbox" class="list2" value="1">1
    <input type="checkbox" class="list2" value="2">2</div>

JS:

$(document).ready(function () {
    function toggleDiv() {
        var $this = $(this);

        $("." + $this.attr('id'))[$this.is(':checked') ? 'hide' : 'show']();

        $(":checkbox").each(

        function () {
            $(this).attr('checked', true);
        });

    }
    $('input:checkbox').each(toggleDiv).click(toggleDiv);
});

ここに現在あります：http://jsfiddle.net/oskar9/8k2HK/

Answer 1

event.preventDefault()「チェックボックスがチェックされないように..」という理由で提案するよう促された質問の最初のビュー。しかし、後で何度も何度も読んで、あなたが何か違うものを望んでいることを理解しています. 「チェックして隠す」一歩手前。この質問のために、jsFiddle でデモを用意しました。「上のチェックボックス」は、「サブのチェックボックス」を次のように制御します。

$("input.upper-box").on("change", function() {
var $this = $(this); 
 $this.next("div.sub-group")
     .find(":checkbox")
     .prop("checked", $this.prop("checked"))
 .end()
 .toggle("slow"); 
});

jquery チームが提案するチェックボックスに関する注意事項の 1 つは、ターゲット ($ 1.6+)prop()の代わりに使用する必要があることです。attr()

Answer 2

Try this jsfiddle.net/Subhash09/8k2HK/10/