找到所有的家长并在树视图中检查他们

Finding all parents and checking them in a treeview?

本文关键字:视图 他们 检查      更新时间:2023-09-26

我在这个页面上使用这个代码:http://experiments.wemakesites.net/css3-treeview-with-multiple-node-selection.html

我的问题是,它想要反向选择。也就是说,选中复选框的所有父框,而不是子框。

例如,在上面的链接中,如果您要单击我的文档,我希望DocumentsLibraries也选中。

我尝试过使用parents(),以及多个版本的parent().parent().prev().prev(),我唯一想到的是有点功能的是:

$(".acidjs-css3-treeview").delegate("label input:checkbox", "change", function() {
    var
    checkbox = $(this),
    nestedList = checkbox.parent().parent().parent().prev().prev(),
    selectNestedListCheckbox = nestedList.find("input:checkbox");
    if(checkbox.is(":checked")) {
        return selectNestedListCheckbox.prop("checked", true);
    }
    selectNestedListCheckbox.prop("checked", false);
});

这将只选择第一个父节点,而我需要所有的父节点。我想我可以构造一个循环来继续使用相同的脚本,但它看起来非常丑陋。

做我正在寻找的事情的更干净的方式是什么?

您可以使用jQuery的parents()方法完成此操作,然后检查直接子元素的输入。您可能需要根据html的布局对其进行修改。我已经用jsfiddle演示过了。

关键部分是:

var checkboxes = $this.parents().children('input');
全额

:

$('input').on('change', function() {
    var $this = $(this);
    var checkboxes = $this.parents().children('input');
    if($this.is(":checked")) {
        return checkboxes.prop("checked", true);
    }
    checkboxes.prop("checked", false);
});