我在程序中创建一个jstree.现在,我可以获取已检查的节点ID.但是,如何获取父节点ID以及父节点的父节点ID.
下面是我的Javascript以获取子节点ID.
$('#tree-container').on('changed.jstree', function (e, data) {
var i, j, r = [];
for (i = 0, j = data.selected.length; i < j; i++) {
r.push(data.instance.get_node(data.selected[i]).id.trim());
}
//alert('Selected: ' + r.join(', '));
console.log('Selected: ' + r.join(', '));
});
这是我的jsfddle.请看一下. http://jsfiddle.net/jjfcnho8/2/当我选择“孩子9”时,我可以得到孩子9的ID.然后,我如何获得孩子2和文件夹1的ID.
有人知道请帮助我.非常感谢你!
解决方法:
您可以使用从data.instance.get_node()获得的节点对象的parents属性.由于多个节点可能具有相同的祖先,因此您可能要避免收集重复项.为此,您可以使用Set.这只是您可以做到的一种方法:
var nodesOnSelectedpath = [...data.selected.reduce(function (acc, nodeId) {
var node = data.instance.get_node(nodeId);
return new Set([...acc, ...node.parents, node.id]);
}, new Set)];
console.log('Selected: ' + nodesOnSelectedpath.join(', '));
请注意,这还将包括根节点,其ID为“#”.
这是更新的fiddle.
没有根节点
console.log('Selected: ' + nodesOnSelectedpath.filter(id => id !== '#').join(', '));
EcmaScript2015
上面的脚本使用了EcmaScript2015(ES6)中的功能.如果某些编辑器未配置为识别ES6语法,则可能会突出显示语法错误. Here您可以找到如何为ES6配置VSCode,Sublime Text和WebStorm.
ES5替代
在ES5中,您将使用对象(acc)收集唯一的ID引用作为属性名称.尽管Object.keys实际上是ES6,但其他ES5浏览器通常支持它:
var nodesOnSelectedpath = Object.keys(data.selected.reduce(function (acc, nodeId) {
var node = data.instance.get_node(nodeId);
node.parents.forEach(function (id) {
acc[id] = 1;
});
acc[node.id] = 1;
return acc;
}, {}));
这是对应的fiddle.
数据中的循环引用
您在评论中写道,您试图这样做:
JSON.stringify(data)
但是该数据结构中包含父引用和子引用,因此可以从子引用到其父对象,再从那里返回其子对象,这是无止境的.此类结构无法转换为JSON.有关解决方案,请参见this Q&A.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。