如何在jsTree中隐藏/着色/禁用不可单击的复选框？

Question

I list files in directories that can be downloaded. I made the checkboxes of objects that I don't want user to be able to download non-clickable. All directories cannot be downloaded and some of the files.

But I want to hide the checkboxes completely. It is very confusing that the checkbox is there but cannot be used.

My sample code is on jsfiddle

Answer 1

I think you could use load event of the tree and code like that:

$("#tree").bind("loaded.jstree", function (event, data) {
  $(this).find('li[rel!=file]').find('.jstree-checkbox:first').hide();
})

And then invoke jstree.

Answer 2

Basically, there are two quick, CSS methods for hiding the checkbox:

1. Use display:none
2. Use visibility:hidden

Here's a fiddle that uses the first for directories and the second for disabled files; but it's not that big a deal. The major difference, as you saw, is that the second leaves the empty space.

Also! Important! The CSS uses the attribute selector and the child selector , neither of which are supported in IE6.