javascript - 动态列表复选框问题

Question

我的代码可以在 JSFIDDLE 中找到

我对列表中的动态复选框选择有疑问。 如果我选中 parent1 复选框，则应该只选中 parent 1 的子项。

如果我检查 Parent1, Category 1.1, Category 1.2, Category 1.3 应该只检查， 如果我取消选中 Parent 1, the childrens 也将取消选中。

因为这些值来自 foreach 循环中的数据库，我在下面的代码中引用了它。

这是我的代码。

<div class="middle-right">
        <ul class="mid-right-list">
            <?php   
                foreach($pntrs AS $ps)
                {
                $catrs=$media->Catgselectn($ps['parent_id'],'sales_catmgmt');
            ?>

            <li><b>+ <?php echo $ps['parent_name'];?></b>

            <?php
                foreach($catrs AS $cg)
                {
            ?>
            <ul>
                <li><input type="checkbox" class="checkbox1" name="catg[]" value="<?php echo $cg['cat_id']; ?>"><?php echo $cg['cat_name']; ?></li>
            </ul>
            <? } ?>
              </li> 
             <?php
            }
            ?>
        </ul>
    </div>

Answer 1

这是 Jquery 解决方案。你可以使用 jquery。 JsFriddle

$(function () {
    $("input[type='checkbox']").change(function () {
        $(this).siblings('ul')
            .find("input[type='checkbox']")
            .prop('checked', this.checked);
    });
});