如何在 JS 树库中隐藏复选框答案

【问题标题】：How to hide a checkbox in JS Tree Library如何在 JS 树库中隐藏复选框
【发布时间】：2017-10-12 11:13:37
【问题描述】：

我需要隐藏一些通过 JSTree 库呈现的复选框。

这里是 HTML：

<div id="tree">
    <ul>
        <li id="folder_1">Folder 1
            <ul>
                <li id="child_1">Child 1</li>
                <li id="child_2">Child 2</li>
            </ul>
        </li>
        <li id="folder_2">Folder 2</li>
    </ul>
</div>

这里是 JS：

$(function () {
    $("#tree").jstree({
        "checkbox": {
            "keep_selected_style": false
        },
            "plugins": ["checkbox"]
    });
    $("#tree").bind("changed.jstree",
    function (e, data) {
        alert("Checked: " + data.node.id);
        alert("Parent: " + data.node.parent); 
        //alert(JSON.stringify(data));
    });
});

我需要隐藏文件夹 1 中的复选框（子 2），但显示子 2 但没有复选框。我包括jsfiddle link。

【问题讨论】：

@VTodorov 感谢您重新组织我的问题。我将此标记为我下一个问题的输入。
我似乎无法理解您真正想要什么。您是否想要两个子对象的复选框或仅子 2 的复选框？
仅限儿童 2。

标签： jquery css jstree

【解决方案1】：

您可以添加一个 css 类来删除复选框。

<li id="" class="no-checkbox">Child 2</li>

CSS：

.no-checkbox i.jstree-checkbox {
  display:none;
}

这是LINK

【讨论】：

如果我也可以禁用隐藏复选框，因为当父复选框被选中时，它显示所有子节点都被选中。隐藏复选框的基本思想是不允许用户选择它。

【解决方案2】：

VTodorov 给出的上述答案对我有所帮助，但它会禁用所有父复选框。

所以这里是改进的方法

CSS：

.no-checkbox > a > i.jstree-checkbox {
   display:none;
}

【讨论】：