Ztree树节点复选框选择问题

最新推荐文章于 2021-07-23 17:51:17 发布

白白小甜鼠

最新推荐文章于 2021-07-23 17:51:17 发布

阅读量1.8k

点赞数

分类专栏： javascript 前端 html5

本文链接：https://blog.csdn.net/weixin_43103905/article/details/87875920

版权

本文介绍了如何使用Ztree实现树节点复选框的初始化，包括设置节点不可选中状态以及全选未选中节点的方法。通过设置`checked`和`chkDisabled`属性控制节点选中与禁用状态，并提供了全选操作的实现思路，涉及到jQuery与Ztree API的结合使用。

摘要由CSDN通过智能技术生成

最近本人在尝试使用ztree制作树状图，在初始化的时候由于项目需要，要设置部分节点复选框不可选择，同时也要设置全选功能。

一、初始化树节点不可选中状态

我们使用官方给出的awesome样式的树形节点，在此基础上我们做了部分微调，在初始化设置时，初始数据时除了,参考官方API:http://www.treejs.cn/v3/api.php
id(本节点id)，pId(父节点id)，name(显示的名称)这几个必要属性外，还可以设置:

1.checked

该属性描述是否已选中，如果初始化需要被选中则设置为true，默认为没有设置该属性

2.chkDisabled

该属性描述该复选框是否可进行操作，即类似于html中设置disabled，默认同checked属性。
设置静态初始化数据如下，

var zNodes =[
            {
    id:1, pId:0, name:"pNode 1", checked: true,chkDisabled:true},
            {
    id:11, pId:1, name:"pNode 11"},
            {
    id:111, pId:11, name:" sNode 111"},
            {
    id:112, pId:11, name:"sNode 112"},
            {
    id:113, pId:11, name:"sNode 113",checked: true,chkDisabled:true},
            {
    id:114, pId:11, name:"sNode 114",checked: true,chkDisabled:true},
            {
    id:12, pId:1, name:"pNode 12",checked: true,chkDisabled:true},
            {
    id:121, pId:12, name:"sNode 121"},
            {
    id:122, pId:12, name:"sNode 122"},
            {
    id:123, pId:12, name:"sNode 123"},
            {
    id:124, pId:12, name:"sNode 124"},
            {
    id:13, pId:1, name:"pNode 13", isParent:true},
            {
    id:2, pId:0, name:"pNode 2"},
            {
    id:21, pId:2, name:"pNode 21", open:true},
            {
    id:211, pId:21, name:"sNode 211"},
            {
    id:212, pId:21, name:"sNode 212"},
            {
    id:213, pId:21, name:"sNode 213"},
            {
    id:214, pId:21, name:"sNode 214"},
            {
    id:22, pId:2, name:"pNode 22"},
            {
    id:221, pId:22, name:"sNode 221"},
            {
    id:222, pId:22, name:"sNode 222"},
            {
    id:223, pId:22, name:"sNode 223"},
            {
    id:224, pId:22, na