jstree 树结构有两种分类，怎么只选择其中一棵树

思路就是：找出父节点的所有子节点的checked的属性设置成与父节点一致即可

我是利用jquery实现，看看是否符合你的要求

<script src="/lib/jqueryjs" type="text/javascript"></script>

<script src="/jquerytreeviewjs" type="text/javascript"></script>

<script type="text/javascript">

$(function(){

$("#tree")treeview();

$("input[name='ids']")click(function(){

var checkedValue = thischecked;

$(this)parent("li")find("input[name='ids']")attr("checked",checkedValue);

});

})

</script>

<ul id='tree'>

<li>

<input type='checkbox' name='ids' id="test"/>

<span class='folder'>test1</span>

<ul>

<li>

<input type='checkbox' name='ids' />

<span class='folder'>test11</span>

</li>

</ul>

<ul>

<li>

<input type='checkbox' name='ids' />

<span class='folder'>test12</span>

<ul>

<li>

<input type='checkbox' name='ids' />

<span class='folder'>test121</span>

</li>

</ul>

</li>

</ul>

</li>

</ul>

动态加载 那 就是 通过ajax 发出请求 接受 JSON格式的字符串 再转化成 javascript 识别的JSON 对象

也就是 “${themeList}” 就可以了

前台通过URL 到 服务端 请求数据 服务端（返回的必须是JSON格式的） 返回数据 前台处理就行了

jstree默认打开有两种方式，一种在生成树结构时在有子节点的li中加class="jstree-open"

还有一种是树形载入完成后用jstree的展开所有节点open_all事件展开所有节点

跳转是要在生成时在li中加<a href="#">XXX<a/>或在载入完后再用js加载

JsTree是一个基于JQuery的框架，实现简单，功能比较齐全。项目中急于修改树控件，现学现卖，实现了简单的功能，仅包含异步加载，动态设置节点样式图标，靠着自己看帮助文档，多次尝试一步步完成。

1 实现异步加载

$("#tvBox")tree({

data : {

async : true,

type : "xml_flat",

[color=red]opts : {

url : URL

}

},

types : {

"default" : {

renameable : false,

deletable : false,

creatable : false,

draggable : false

}

},

ui:{

theme_name : "classic"

},

callback : {

beforedata : function(NODE, TREE_OBJ) {

setParams(NODE, TREE_OBJ); // 获取参数信息

//向服务器传递参数

return { type : type_id, dyj : dyj_id, bdz : bdz_id, jg : jg_id, ept : ept_id }

},//end beforedata

onselect : function(NODE, TREE_OBJ) { // 单击函数，点击设备节点名称的时候在右边显示信息

setParams(NODE, TREE_OBJ); // 获取参数信息

var ids = $(NODE)attr("id")split("-");

// alert(ids[6]);

var subType = ids[1];

var dydj = ids[2];

//alert(type_id+" -- "+ept_id);

var nodeParam="type="+type_id+"&subType="+subType+"&bdz="+bdz_id+"&dydj="+dydj+"&ept="+ept_id;

if (type_id == EptTypedyj) {//点击的是电业局节点

var dyj_url = "pages/omds/ept/dyj/dyjjspdyj="+dyj_id+"&"+nodeParam;

//alert(dyj_url+" -- "+dyj_name);

topdoCreateTabItem(dyj_url,

dyj_name,

dyj_url+"&random="+Mathrandom(),

dyj_name);//在'主页'标签中显示

}

}, //end onselect

// 只在树第一次加载的时候调用

onload : function(TREE_OBJ) {

$("#tvBox ul li a:first-child ins")hide(); //电业局节点不显示图标

}

}// end callback

}); // end tree()

JsTree支持多种格式的数据源，这里使用了xml格式，其实json格式更好。data中代码即可实现异步加载，通过设置UI参数可以修改主题，callback参数可以对一些事件作出响应，如beforedata可以在发送异步请求之前添加url参数，onselect可以响应生成的树中节点的单击事件，还有open在节点被打开的时候被调用，等等，可以帮助实现很多功能……

--1 碰到比较麻烦的事情是展开子节点向后台传递参数时需要用到父节点的id等信息，需要用到parent函数。

--2 另外，当展开一个节点从后台没有查询到子节点时需要返回<root></root>，不能使<root>,我当时用jdom生成xml碰到后者，出现了问题。

--3 callback中的事件需要自己去尝试才能知道什么时候被触发

2 实现节点换肤

项目中涉及到得是电业局--变电站--间隔--设备，对于后三者节点图标必须与其状态对应，且状态是动态的，所以需要后台在生成xml的时候设置icon属性

$('#tree_2')jstree({

'plugins': ["wholerow", "checkbox", "types"],

'core': {

"themes" : {

"responsive": false

},

'data': [{

"text": "Same but with checkboxes",

"children": [{

"text": "initially selected",

"state": {

"selected": true

}

}, {

"text": "custom icon",

"icon": "fa fa-warning icon-state-danger",

"state": {

"selected": true

}

}, {

"text": "initially open",

"icon" : "fa fa-folder icon-state-default",

"state": {

"opened": true

},

"children": ["Another node"]

}, {

"text": "custom icon",

"icon": "fa fa-warning icon-state-warning"

}, {

"text": "disabled node",

"icon": "fa fa-check icon-state-success",

"state": {

"disabled": true

}

}]

},

"And wholerow selection"

]

},

"types" : {

"default" : {

"icon" : "fa fa-folder icon-state-warning icon-lg"

},

"file" : {

"icon" : "fa fa-file icon-state-warning icon-lg"

}

}

});

设置了插件的show_only_matches为ture后，输入带匹配限制的短语，显示节点。但是如果输入的关键字不匹配任何节点，没有显示空，而是显示了所有节点。

查询了资料得知:

这是jsTree的有意行为。

之前jsTree是隐藏所有节点的。但是当时对于这个报了很多错误。因此现在jsTree不会自动隐藏所有节点，因为它对于大多数应用来说是非常混乱和不合适的。

但是如果你想隐藏全部节点也是有办法的。办法如下：

1只要监听下searchjstree事件：

2然后别忘记在进行新的搜索的时候把它们显示出来：

以上就是关于jstree 树结构有两种分类，怎么只选择其中一棵树全部的内容，包括:jstree 树结构有两种分类，怎么只选择其中一棵树、javascript jstree 异步加载 大数据 json格式数据 动态加载、jstree是否定义了让每个节点会有一个url地址，直接点击节点的跳转到其它的页面去。。等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！