转：zTree高级入门：如何通过扩展节点的属性来达到是否显示节点的删除编辑等图标（按钮）...

当我们在使用ztree树组件的节点编辑功能时，只要我们引入了ztree相关节点编辑的js脚本文件：

<script type="text/javascript" src=”/js/jquery.ztree.exedit-3.5.js"></script>

接着配置setting内的edit节点：

var setting = {edit: {enable: true,showRenameBtn: true,showRemoveBtn: true},

当我们ztree树加载完成后，我们将鼠标移动至每一个树节点上，节点后面均会显示两个图标，一个“删除节点”图标，一个是“编辑节点”图标。点击后可以进行节点的编辑和删除操作。

这样虽然很完美，但是还不够完美，如果我们针对某些节点不需要不需要进行节点的编辑或者删除操作，换言之就是某些节点不让其显示操作的图标。怎么办呢？

很显然，ztree树控件对于这一点上做得还不是很够，但是它已经给我们留了很大的扩展空间。

解决方案如下：

1、给节点扩展两个属性：noRemoveBtn和noEditBtn，分别设置为true表示均不显示操作图标。当然这里配置是第一步，还有第二步的哦。

示例代码如下：

var zNodes = [{ id: 1, pId: 0, name: "父节点 1", open: true, noRemoveBtn: true, noEditBtn: true },{ id: 11, pId: 1, name: "叶子节点 1-1",noRemoveBtn: false,noEditBtn:true },{ id: 12, pId: 1, name: "叶子节点 1-2" },{ id: 13, pId: 1, name: "叶子节点 1-3" }];

2、我们将setting内的edit节点下的showRenameBtn、showRemoveBtn两个属性就行修改，变成一个方法来返回是否显示图标，形如：

edit: {enable: true,showRenameBtn: showRenameBtn},

3、编写showRenameBtn(treeId,treeNode)方法，这里以是否显示节点编辑图标为例：

 //是否显示编辑按钮
function showRenameBtn(treeId, treeNode) { //获取节点所配置的noEditBtn属性值           if (treeNode.noEditBtn != undefined && treeNode.noEditBtn) {return false;} elsereturn true;
}

刷新我们的页面，然后就可以看到第一二个节点当我们鼠标移动上去的时候后面图标的显示情况。

补充：

1、showRenameBtn(treeId,treeNode)方法的执行或者触发是当我们鼠标移动至某个节点上时触发或者执行的，所以我们能够很清楚地知道节点的对象，接着判断其属性值情况。

转载于:https://www.cnblogs.com/spring_wang/p/4112898.html

转：zTree高级入门：如何通过扩展节点的属性来达到是否显示节点的删除编辑等图标（按钮）...相关推荐

解决TreeView的节点更改NodeFont后无法完全显示节点名的问题
今天做树视图显示数据的时候,准备把树视图中第一级节点设成小四号粗体,第二级节点设成五号字体. 在代码中更改Node的字体字号以后,发现节点名的后半部分显示不出来 node.NodeFont = new ...
echarts树状图点击展开子节点_CPU眼里的结构设备树节点及属性详解
1 设备树(device tree)简介DTSpec定义一个devicetree的约束来描述硬件设备,boot引导程序将设备树传递给用户程序的内存空间中,并传递给用户相应设备树的指针.设备树为一个树形 ...
节点操作大全(二)~操作节点的属性
下面是对节点属性操作的整理,希望可以帮助到有需要的小伙伴~ 跟小编来康康吧文章目录获取节点的属性值设置节点的属性值删除节点的属性获取节点的属性值方式1: 元素节点.属性; 元素节点[属性] ...
14 bs对象.节点名称.name attrs string 获取节点名称属性内容
14 bs对象.节点名称.name attrs string 获取节点名称属性内容 14.1 提取节点名称属性内容的方法 tag [tæɡ]:标签. attr:属性. string [strɪ ...
Ztree勾选节点后取消勾选其父子节点
前言: Ztree官方给的API可以设置勾选一个节点的同时勾选子节点或者父节点,也可以设置不影响父子节点,即将chkboxType设置为{"Y":"",&quo ...
ztree autoCheckTrigger=true时子节点复选框选中导致父节点onCheck触发多次问题处理
ztree实现复选框功能,并且子节点选中时,父节点自动选中,子节点取消选中(若所有子节点都没有选中)则父节点也会自动取消选中,check配置如下: check: {enable: true,chk ...
二、基础入门——数据包扩展
二.基础入门--数据包扩展(2022.11.7) 1. http和https区别 http相当于明文,https相当于是加密过后的. HTTP HTTPS TCP SSL or TLS IP TC ...
【ROS入门-3】嘴对嘴讲解ROS的核心概念——节点与节点管理器
文章目录前言 ROS系列文章 ROS的通信机制节点(Node) 节点管理器(Master) 简单运行引用说明参考前言我要给大家来介绍一下ROS当中一些核心的概念,帮助大家去在后面的ROS学 ...
Neo4j 图数据库高级应用系列 / 服务器扩展指南 APOC 8.8 - 图生成完全图
1.概述 apoc.generate.complete 本过程生成一个完全图.完全图中,每个节点有到所有其他节点的边.在无向图中,有N个节点的完全图有N x (N – 1) / 2个边.Neo4j在存 ...
Neo4j 图数据库高级应用系列 / 服务器扩展指南 APOC 8.7 - 图生成无标度网络
1.概述 Barabási和Albert(1999)的"富者更富"(Rich get richer)生成模型(BA模型)最被熟知的无标度网络子集的生成模型.它让每个网页根据一个非均 ...

转：zTree高级入门：如何通过扩展节点的属性来达到是否显示节点的删除编辑等图标（按钮）...

转：zTree高级入门：如何通过扩展节点的属性来达到是否显示节点的删除编辑等图标（按钮）...相关推荐

最新文章

热门文章