取消选择选定的treenode JStree - jQuery答案

【问题标题】：Deselect selected treenode JStree - jQuery取消选择选定的treenode JStree - jQuery
【发布时间】：2014-02-27 14:40:10
【问题描述】：

情况

当我的页面被加载并且我的树视图可见时，没有选择树节点。当我点击一个节点时，它被选中，这是默认行为。

问题

如何在单击同一节点时取消选择该节点？所以我想点击一个选定的节点来取消选择它。我一直在搜索文档。但是事件 'select_node' 将首先选择节点，然后我才能检查它的 selectstatus。

我知道有一种方法可以在我单击按钮时取消选择带有代码的节点，但这不是我想要的。我想点击已经选中的节点。

我该怎么做？

链接

文档事件JStree：http://www.jstree.com/api/#/?q=.jstree%20Event&f=enable_node.jstree

【问题讨论】：

您希望将此选中/取消选中状态保存到服务器端吗？这样下次你再次加载树时，你会得到相同的状态，你离开的地方？？
不，我只是不想在树外单击时选择节点。
这里有一些很好的建议：stackoverflow.com/questions/11576444/…。您应该按住 CTRL 键取消选择。

标签： jquery html jstree

【解决方案1】：

今天突然出现这个问题。我希望在初始化树时至少可以设置一个配置选项。虽然它不漂亮，但这是我为规避问题所做的：

var _selectedNodeId;
$("#myTree").on("select_node.jstree", function (e, _data) {
    if ( _selectedNodeId === _data.node.id ) {
        _data.instance.deselect_node(_data.node);
        _selectedNodeId = "";
    } else {
        _selectedNodeId = _data.node.id;
    }
}).jstree();

本质上，我正在跟踪选定的节点并将其与已单击的节点进行检查。这种方法的缺点是，如果您在“changed.jstree”上触发了回调，它将触发两次，因为您首先“选择”，然后如果它已经被选择，则“取消选择”。

【讨论】：

_data.instance.deselect_node(_data.node);

【解决方案2】：

我找到了一种通过添加multiselect 插件来启用此行为的方法。并在需要单选时将multiple 配置选项设置为false：

$('#my-tree').jstree({
  core: { multiple: false },
  plugins: ['multiselect']
})

【讨论】：

【解决方案3】：

单击时取消选择选定的节点。

$('#my-tree').('click', '.jstree-clicked', function () {
  $('#my-tree').(true).deselect_node(this);
});

你也可以在取消选择时添加一个监听器。

$("#myTree").on("deselect_node.jstree", function (e, data) {
  ...
});

【讨论】：

【解决方案4】：

在这里我找到了取消选择所有节点的正确方法：

$("#jstree").jstree().uncheck_all(true);

【讨论】：