【问题标题】:JSTree select_node event and checkboxJSTree select_node 事件和复选框
【发布时间】:2011-01-05 10:06:23
【问题描述】:

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

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

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

【问题讨论】:

    标签: jquery checkbox jstree


    【解决方案1】:

    JsTree 提供样式themes,因此您可以定义自己的样式并加载它。 您只需要替换精灵图像即可。

    【讨论】:

    • 这并不能回答我的问题,即当复选框处于活动状态而不使用箭头(或任何我可能用箭头替换的图像)时如何切换节点
    【解决方案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(); + }); + });

    【讨论】:

      【解决方案3】:

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

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-06-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多