在jquery中通过父复选框检查子复选框

时间:2015-06-10 14:21:31

标签: javascript jquery html event-handling

我正在尝试通过Jquery中的父复选框检查子复选框。但是代码在下次停止工作时第一次正常工作

$(document).ready(function () {
    $("#append").delegate("#p0", "click", function () {
        if (this.checked == true) {
            $("#submenu0 input").attr('checked', true);
        } else {
            $("#submenu0 input").attr('checked', false);
        }
    });

HTML

<div id="append" name="append" style="background-color: white;">
    <input type="checkbox" id="p0" value="Administrative Boundary">
    <div id="submenu0" class="a" style=" margin-left: 29px ">
        <input type="checkbox" id="pc00" value="KBJNL:district_boundary_2011" checked="checked">District Boundary 2011
        <br>
    </div>
</div>

2 个答案:

答案 0 :(得分:0)

在jquery中使用 on 进行事件委派,并使用attr()代替$(document).ready(function () { $("#append").on("change","#p0", function() { $("#submenu0 input").prop('checked', this.checked); }); });

max-width: 100%

<强> DEMO

答案 1 :(得分:0)

您可以使用所点击的复选框的checked状态来更新其他复选框。

查看内联评论。

// Use change event, and on to bind events, delegate calls on inside
$("#append").on("change", "#p0", function() {
    $("#submenu0 :checkbox").prop('checked', $(this).is(':checked'));
    // if this checkbox is checked then check all the checkboxes inside #submenu0
});