javascript - jstree中选择子节点时如何获取完整的父节点名称和子节点名称

Question

我正在获取子树 ID:

但是当我选择所有子节点时，我将获取父节点 ID。

我想获取其父节点名称的完整层次结构。

例如:-

node 1 >node 1 child node 1 

node 1 >node 1 child node 2

这是我的所有代码

<div id="demo1" class="demo">
  <ul>
    <li id="phtml_1">
      <a href="#">node 1</a>
      <ul>
        <li id="phtml_3">
          <a href="#"> node 1 Child node 1</a>
        </li>
        <li id="phtml_2" >
          <a href="#">node 1 Child node 2</a>
        </li>
      </ul>
    </li>
    <li id="phtml_4">
      <a href="#">Root node 2</a>
    </li>
  </ul>

  <script type="text/javascript" class="source">
    $(function () {
      $("#demo1").jstree({ 
        "plugins" : [ "themes", "html_data", "checkbox", "sort", "ui" ]
      });
    });
  </script>
</div>
<h4 id="menu" name="menu">
  click menu
</h4>


<script type="text/javascript">
  $("#menu").click(function() {
    var ids = $('#demo1 li.jstree-checked').filter(function() { 
      return $(this).parents('li.jstree-checked').length == 0; 
    }).map(function() { 
      return this.id;
    }).get();

    alert(ids);

  });
</script>
<script type="text/javascript" src="http://johntang.github.io/JsTree/_lib/jquery.js"></script>
<script type="text/javascript" src="http://johntang.github.io/JsTree/jquery.jstree.js"></script>

对此问题的任何帮助或指导，我们将不胜感激。

Answer 1

您可以使用 get_path 方法，如下所示。查看演示 - Fiddle .

var glue = ' > ', // if you want a specific string separator, otherwise use false
    showIds = true; // if false names will be shown

$('#tree').jstree().get_path(data.node, glue, showIds )