栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

使用存储在数组中的替代JSON格式创建动态jstree

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

使用存储在数组中的替代JSON格式创建动态jstree

如果希望数据是动态的,则可以使用以下代码初始化jstree:

$('#jstree').jstree({    'core': {        'data': arrayCollection    }});

其中 ArrayCollection的 是,则为您的动态数组变量。例如,您的arrayCollection可能如下所示:

var arrayCollection = [    {"id": "animal", "parent": "#", "text": "Animals"},    {"id": "device", "parent": "#", "text": "Devices"},    {"id": "dog", "parent": "animal", "text": "Dogs"},    {"id": "lion", "parent": "animal", "text": "Lions"},    {"id": "mobile", "parent": "device", "text": "Mobile Phones"},    {"id": "lappy", "parent": "device", "text": "Laptops"},    {"id": "daburman", "parent": "dog", "text": "Dabur Man", "icon": "/"},    {"id": "Dalmation", "parent": "dog", "text": "Dalmatian", "icon": "/"},    {"id": "african", "parent": "lion", "text": "African Lion", "icon": "/"},    {"id": "indian", "parent": "lion", "text": "Indian Lion", "icon": "/"},    {"id": "apple", "parent": "mobile", "text": "Apple IPhone 6", "icon": "/"},    {"id": "samsung", "parent": "mobile", "text": "Samsung Note II", "icon": "/"},    {"id": "lenevo", "parent": "lappy", "text": "Lenevo", "icon": "/"},    {"id": "hp", "parent": "lappy", "text": "HP", "icon": "/"}];

最后,您的html文件应如下所示:

<html>    <head>        <title>JSTree</title>        <link rel="stylesheet" href="dist/themes/default/style.css" />        <script src="dist/libs/jquery.js"></script>        <script src="dist/jstree.js"></script>        <script> $(function() {     var arrayCollection = [         {"id": "animal", "parent": "#", "text": "Animals"},         {"id": "device", "parent": "#", "text": "Devices"},         {"id": "dog", "parent": "animal", "text": "Dogs"},         {"id": "lion", "parent": "animal", "text": "Lions"},         {"id": "mobile", "parent": "device", "text": "Mobile Phones"},         {"id": "lappy", "parent": "device", "text": "Laptops"},         {"id": "daburman", "parent": "dog", "text": "Dabur Man", "icon": "/"},         {"id": "Dalmation", "parent": "dog", "text": "Dalmatian", "icon": "/"},         {"id": "african", "parent": "lion", "text": "African Lion", "icon": "/"},         {"id": "indian", "parent": "lion", "text": "Indian Lion", "icon": "/"},         {"id": "apple", "parent": "mobile", "text": "Apple IPhone 6", "icon": "/"},         {"id": "samsung", "parent": "mobile", "text": "Samsung Note II", "icon": "/"},         {"id": "lenevo", "parent": "lappy", "text": "Lenevo", "icon": "/"},         {"id": "hp", "parent": "lappy", "text": "HP", "icon": "/"}     ];     $('#jstree').jstree({         'core': {  'data': arrayCollection         }     }); });        </script>    </head>    <body>        <div id="jstree"></div>    </body></html>

每当修改arrayCollection时,都必须将arrayCollection重新分配给jstree并以编程方式刷新jstree。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/418430.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号