jstree jquery如何遍历所有节点

Hsh*_*122 17 javascript jquery jstree

我正在尝试遍历jstree中树视图中的每个节点.树视图有4层深,但我似乎无法超越第1层.以下是用于迭代的jQuery.

$("#myTree").bind('ready.jstree', function (event, data) {
    $('#myTree li').each(function () {
        // Perform logic here
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

是一个说明我的观点的jsfiddle.请帮助我如何迭代jstree中的每个节点.

E. *_*din 21

这会使你的树的所有孩子都在一个平面数组中为你的.each循环.

$("#tree").bind('ready.jstree', function(event, data) {
  var $tree = $(this);
  $($tree.jstree().get_json($tree, {
      flat: true
    }))
    .each(function(index, value) {
      var node = $("#tree").jstree().get_node(this.id);
      var lvl = node.parents.length;
      var idx = index;
      console.log('node index = ' + idx + ' level = ' + lvl);
    });
});
Run Code Online (Sandbox Code Playgroud)

JSFiddle - get_json的文档


juv*_*ian 8

另一种方法是在尝试访问dom中的节点之前打开它们然后关闭它们:

$("#tree").bind('ready.jstree', function (event, data) {
  $(this).jstree().open_all(); // open all nodes so they are visible in dom
    $('#tree li').each(function (index,value) {
        var node = $("#tree").jstree().get_node(this.id);
        var lvl = node.parents.length;
        var idx = index;
        console.log('node index = ' + idx + ' level = ' + lvl);
    });
    $(this).jstree().close_all(); // close all again
});
Run Code Online (Sandbox Code Playgroud)