html代码
<div id="jstree1"></div>
js代码:
<script src="__STATIC__/h5/js/jquery.min.js?v=2.1.4"></script>
<script src="https://static.jstree.com/3.3.5/assets/dist/jstree.min.js"></script>
<script>
$(document).ready(function () {
$('#jstree1').jstree({
'core' : {
"animation" : ,
"check_callback" : true,
'force_text' : true,
"themes" : { "stripes" : true },
'data' : {
//"url" : "//www.jstree.com/fiddle/?lazy",
"url":"{:url('img/imgFolder/jsTree')}",
"dataType" : "json",
"data" : function (node) {
return { "id" : node.id }; }
}
},
"plugins" : [ "contextmenu", "dnd", "search", "state", "types", "wholerow" ]
}); }); function demo_create() {
var ref = $('#jstree1').jstree(true), sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[];
sel = ref.create_node(sel, {"type":"file"});
if(sel) {
ref.edit(sel);
}
};
function demo_rename() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[];
ref.edit(sel); };
function demo_delete(){
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
ref.delete_node(sel); //$("#1").remove();
console.log(sel) ref.set_text(, ''); }
</script>
其中data数据格式
$('#jstree1').jstree({ 'core' : {
'data' : [
{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },
{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },
{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },
{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" }
]
} });