在 jstree 中仅显示选中的节点及其父节点

Question

我必须只显示选定的节点和父节点，并隐藏其余节点。

当前文档中没有get_unchecked。我的 json 格式很大，所以将其放入字符串中并格式化和重新加载树将效率低下。

有没有办法获取所有未检查的节点并将其隐藏？如果有，我可以检查当前检查节点的所有父节点，然后隐藏所有未检查节点，但我找不到任何方法来检索所有未检查节点。

Answer 1

您可以通过以下方式完成：

获取所有选定的节点以及父节点
遍历所有节点，查看是否有节点未被选中，然后将其隐藏

检查下面的代码和演示 - codepen。

var $tree = $("#myTree").jstree(),
    nodesSelected = $('#myTree').jstree('get_checked', true),
    nodeIdsToStay = [];

nodesSelected.forEach(function(node) {
    var path = $tree.get_path(node, false, true);
    path.forEach(function(n) {
        if (nodeIdsToStay.indexOf(n) === -1) {
            nodeIdsToStay.push(n);
        }
    })
})

$('#myTree').find('li').each(function() {
    if (nodeIdsToStay.indexOf(this.id) === -1) {
        $(this).hide();
    }
})

Answer 2

解决我提出的问题。

$('#jstree_demo_div').on('loaded.jstree', function(e, data) {
  console.log("loaded");
  checked_ids = $('#jstree_demo_div').jstree('get_selected', true);
  $("#jstree_demo_div").jstree('select_all');
  $.each(checked_ids, function(index, value) {
    $("#jstree_demo_div").jstree('deselect_node', value);
    uiParentsShow(value);
  });
  checked_ids = $('#jstree_demo_div').jstree('get_selected', true);
  $.each(checked_ids, function(index, value) {
    $("#jstree_demo_div").jstree('hide_node', value);

  });
});

function uiParentsShow(node) {
  try {
    var parent = $("#jstree_demo_div").jstree('get_parent', node);
    $("#jstree_demo_div").jstree('deselect_node', parent);
    if (parent != '#') {
      uiParentsShow1(parent);
    }
  } catch (err) {
    console.log('Error in uiGetParents' + err);
  }
}

步骤：

第 1 步：选择所有元素
第 2 步：取消选中节点和选中节点的父节点
第 3 步：隐藏选定节点

Answer 3

根据上面的响应，我能够创建这个函数来根据节点属性值过滤 Treeview。（代替 '

$('#jstree').find('li').each(function () {
    if ($("#" + this.id).attr("tag") == "<MYTAG>") {
        $(this).hide();
    }
    else {
        $(this).show();
    }
})

在 jstree 中仅显示选中的节点及其父节点

Show only checked nodes and parents of it in jstree

jstree