使用jQuery遍历ul父级并取消选中复选框 服装 牛仔布 牛仔裤 裤子 百慕大群岛 毛衣 毛衣

给定上述HTML代码，假设我单击“Jeans”（顶部的第三个输入，id=“category_127”）。我想取消选中其父项中的所有输入（牛仔和服装）。 我想让牛仔裤的兄弟姐妹们保持原样。 如何使用jQuery实现这一点？嵌套输入的数量是无限的

谢谢大家!

请尝试以下代码：

    <ul>
    <li>
        <label for="category_125" class="checkbox">
        <input type="checkbox" checked="checked" name="categories[]" value="125" id="category_125">Clothing</label>
        <ul>
            <li>
                <label for="category_126" class="checkbox">
                <input type="checkbox" name="categories[]" value="126" id="category_126">Denim</label>
                <ul>
                    <li>
                        <label for="category_127" class="checkbox">
                        <input type="checkbox" checked="checked" name="categories[]" value="127" id="category_127">Jeans</label>
                    </li>
                </ul>
            </li>
        </ul>
        <ul>
            <li>
                <label for="category_144" class="checkbox">
                <input type="checkbox" name="categories[]" value="144" id="category_144">Trousers</label>
                <ul>
                    <li>
                        <label for="category_146" class="checkbox">
                        <input type="checkbox" name="categories[]" value="146" id="category_146">Bermudas</label>
                    </li>
                </ul>
            </li>
        </ul>
        <ul>
            <li>
                <label for="category_152" class="checkbox">
                <input type="checkbox" name="categories[]" value="152" id="category_152">Sweaters</label>
                <ul>
                    <li>
                        <label for="category_154" class="checkbox">
                        <input type="checkbox" name="categories[]" value="154" id="category_154">Sweaters</label>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

只有在平行类别中没有选中的元素时，才会取消选中父项的复选框。例如，如果勾选了“裤子”和/或“百慕大”，而您取消勾选了“牛仔裤”，那么“衣服”就不会被取消勾选

---

演示：

谢谢，您的代码是一个非常好的起点。你所说的不要取消选中衣服对我来说不是真的，因为选中衣服会显示所有衣服子类别的产品（我不希望这样）。我今天来修，看看能不能修好：）谢谢again@koichirose事实上，这是第一个答案：。也许这对你也有帮助。

$(":checkbox").on("change", function() {
    var $this = $(this);
    var checked = $this.prop("checked");
    if (!checked) {
        $this.parent().siblings("ul").find(":checkbox:checked").prop("checked", false);
    }

    if ($this.closest("ul").find(":checkbox:checked").not(this).length == 0) {
        $this.parents("ul").each(function() {
            if ($(this).siblings("ul").find(":checkbox:checked").length == 0) {
                $(this).siblings("label").children().prop("checked", checked);
            }
        });
    }
});​