javascript - 单击父复选框时选中所有选中的框

Question

当我点击 Parent1 复选框时，我有 Parent1 和复选框，所有属于 parent1 的 child 都应该被选中，parent1 和复选框应该淡出，如果我再次取消选中任何一个 child ，parent1 和复选框应该重新出现并且父值和子值来自数据库并且它们在每个循环中，即每个循环的每个循环的第一个父值在每个循环的子值中。

我的代码在 http://jsfiddle.net/mrc4N/3/ 中

<div class="middle-right">
<ul class="mid-right-list">
<li><span id="Parent1a">+ Parent1<input name="parent" class="pc-box" type="checkbox"></span>
        <ul class="pa rplist">
<li value="1" class="parent1">- Child   1.1 <input class="cc-box" name="child" type="checkbox"></li>
<li value="2" class="parent1">- Child   1.2 <input class="cc-box" name="child" type="checkbox"></li>
<li value="3" class="parent1">- Child   1.3 <input class="cc-box" name="child" type="checkbox"></li>
            </ul>
              </li> 
<li><span id="Parent2a">+ Parent2<input name="parent" class="pc-box" type="checkbox"></span>
    <ul class="pb rplist">
<li value="1" class="parent2 c1">- Child 2.1 <input class="cc-box" name="child" type="checkbox"></li>
<li value="2" class="parent2 c2">-Child 2.2 <input class="cc-box" name="child" type="checkbox"></li>
<li value="3" class="parent2 c3">- Child    2.3 <input class="cc-box" name="child" type="checkbox"></li>
    </ul>
</li>
<li><span id="Parent3a">+ Parent3<input name="parent" class="pc-box" type="checkbox"></span>
<ul class="pc rplist">
<li value="1" class="parent3 c1">-Child 3.1 <input class="cc-box" name="child" type="checkbox"></li>
<li value="2" class="parent3 c2">- Child    3.2 <input class="cc-box" name="child" type="checkbox"></li>
    <li value="3" class="parent3 c3">- Child    3.3 <input class="cc-box" name="child" type="checkbox"></li>
    </ul>               
</li>
</ul>
</div>

提前致谢

Answer 1

你可以使用这样的东西:

$('[type="checkbox"][name="parent"]').click(function(){
    $(this).parent().next('ul').find('li input').prop('checked',this.checked);
});

EXAMPLE HERE