jsTree隐藏复选框

我正在使用jsTree jQuery插件来显示5级深度树。我想不在最后一级显示复选框。有没有办法做到这一点在设置或一些jQuery处理我可以做之后删除这些复选框？我可以使用类型插件禁用它们，但我真的希望它们不可见。jsTree隐藏复选框

这里是我的树 “[X]” 的
的一个实例=复选框

[x] lvl 1 
    [x] lvl 2 
    [x] lvl 3 
     [x] lvl 4 
     [x] lvl 5a 
     [x] lvl 5b 
     [x] lvl 5c

这里是我想要什么 “[X]”
的一个实例=复选框

[x] lvl 1 
    [x] lvl 2 
    [x] lvl 3 
     [x] lvl 4 
      lvl 5a 
      lvl 5b 
      lvl 5c

编辑答案找到

找到了答案。添加将在树加载时调用的.bind，然后使用一些简单的jquery来隐藏复选框。

$("#right-tree2").bind("loaded.jstree", function(event, data) { 
    $('.lvl4').find('ins.jstree-checkbox').hide(); 
}) 
.jstree({....});

来源

2011-05-24 jbrook10

您必须检查树中的最后一个路径。最后一个元素既没有下一个兄弟姐妹，也没有一个孩子。如果是这样，你读取父节点，并删除或隐藏儿童的复选框。我认为你应该把这个代码外包到一个额外的函数中，并在树生成后调用它。我知道这不是非常有效，但可以工作。 – reporter 2011-05-24 15:13:30

好吧，我能够删除节点，但有一个小问题。如果我调用$（'。lvl4'）。find（'ins.jstree-checkbox'）。hide（）;在按钮上单击它的作品，但不是在.jstree调用之后。在树完成渲染后有没有办法执行命令？ – jbrook10 2011-05-24 16:44:16

我不知道你的源代码，所以我不能说它是否可能。 – reporter 2011-05-24 19:33:59

您还可以防止复选框插件从加入他们：

添加类的任何节点类型的<a>标签，你不希望有一个复选框（我用同样的作为我的rel）。

编辑jquery.jstree.js复选框插件将类添加到复选框添加到DOM的.not（）语句。在1.0 RC3它看起来像这样（约2870线）：

$t.children("a" + (_this.data.languages ? "" : ":eq(0)")).not(":has(.jstree-checkbox) // ADD THE LIST OF CLASSES HERE - BE SURE TO INCLUDE THE DOTS AND SEPARATE WITH COMMAS ").prepend("<\ins class='jstree-checkbox'>&#160;<\/ins>").parent().not(".jstree-checked, .jstree-unchecked").addClass(ts ? "jstree-unchecked" : c);

这样，您就不必添加，然后删除它们（如果能够避免它不好的做法）。

来源

2011-11-23 02:23:12 SnydeComments

试试这个，

$("#right-tree2").bind("loaded.jstree", function(e, data) { 
    var currentNode = data.rslt.obj.attr("id"); 
    var nodeLevel = data.inst.get_path().length; 
    if(nodeLevel == 4){ 
     $('#'+currentNode).find('> a > .jstree-checkbox').remove(); 
    } 
})

来源

2013-04-19 06:13:20 mathi

如果要创建从JSON树上，然后我发现删除节点使用一些CSS最简单的方法。

在实际的JSON，设置所需的节点a_attr领域被禁用，以“no_checkbox”，如下图。这会将类“no_checkbox”添加到包含节点文本，图标和复选框的<a>元素。

node = { text: "foo", a_attr: { class: "no_checkbox" } }
在CSS中，像这样创建一个选择：

.no_checkbox>i.jstree-checkbox { display:none }
完成！

这将仅选择直接与no_checkbox类<a>元素中的复选框，它会从布局删除。此方法相对于其他答案的优点是只需从<a>元素中删除类no_checkbox就可以取消复选框。例如，您可以在事件处理程序中为select_node.jstree事件执行此操作，然后获取作为参数传入的DOM节点。

当然，如果您使用HTML而不是JSON输入数据，您可以手动将CSS类添加到HTML中，或者使用PHP /其他服务器端语言，它的工作原理也是一样的。

来源

2014-03-04 12:19:34 Miguel

我发现了另一个使用CSS的解决方案。这个简单的代码隐藏了第一层中的复选框

.jstree-container-ul>li>a>i.jstree-checkbox 
{ 
    display:none 
}

来源

2015-05-31 16:03:32 regufo

jsTree隐藏复选框

回答

相关问题