jquery - JSTree select_node 事件和复选框

Question

我有一个 jstree，在其中我使用 select_node 事件来切换节点（展开），因此删除了树中的切换箭头，因为它们看起来很丑，我不需要它们。

现在我添加了复选框插件以在树中使用，但发现当插件处于活动状态时 select_node 事件被禁用。

如何在激活复选框插件的情况下切换节点，而不重新添加丑陋的切换箭头？我可以在 check/uncheck 事件中执行此操作，但我不想在每次展开节点时都检查/取消选中。

Answer 1

JsTree 提供样式主题，因此您可以定义自己的主题并加载它。您只需要替换精灵图像就可以了。

Answer 2

假设您有http://www.jstree.com/documentation/checkbox中的示例树，其中箭头已删除。您无法在单击事件上同时执行复选框选择和分支切换，而不会中断 ui 交互。但是，由于非叶节点不携带模型数据（它们的复选框仅用作全选/取消全选功能），您可以从中删除复选框，将单击事件重新定义为“toggle_node”，同时离开其余的未受影响。

您可以删除非叶子 li 节点上的复选框，并在它们上进行单击事件来切换叶子。这将完成您想要的行为，但会删除非叶节点复选框的“全选/取消全选”功能。

只需在示例页面上添加下面标有“+”的行。

    $("#demo1").jstree({
       “插件”：[“主题”，“html_data”，“复选框”]
    });

+ $("#demo1 li").not(".jstree-leaf").each(function() {
+ $("一个 ins.jstree-checkbox", this).first().hide();
+ $("a", this).first().click(function(event) {
+ $("#demo1").jstree("toggle_node", "#"+$(this).parent().attr('id'));
+ event.stopPropagation();
+ event.preventDefault();
+ });
+ });

Answer 3

最新版本的 jstree 现在允许通过单击复选框或节点标题来分别检查和选择节点。