当树节点的名称有些很长时,全部显示出来显得很拥挤的情况下,我们会想到用省略节点名称来代替,当鼠标移入节点时能够显示该节点的全称。这样我们应该如何做呢?

首先,我们要在树的节点内多增加一个属性用于设置该节点的全称,这里我们以title名称为例吧,示例代码如下所示:

1.{ id:233, pId:23, name:"叶子节点233...",title:"叶子节点23333434343434"},
2.{ id:234, pId:23, name:"叶子节点...",title:"叶子节点打工撒干撒嘎斯"},
3.{ id:3, pId:0, name:"父节点3 - 没有子节点",title:"卧槽", isParent:true}

其次需要设置setting内data旗下key的title关键属性对应的属性名称

官方API内是这样解释key内title的:

1.zTree 节点数据保存节点提示信息的属性名称。[setting.view.showTitle = true 时生效]
2.如果设置为 "" ,则自动与 setting.data.key.name 保持一致,避免用户反复设置
3.默认值:""

看明白了把,默认情况下会和name属性一致。

为此,我们需要手动设置一下title对应的属性名称,设置代码如下所示:

01.var setting = {
02.data: {
03.simpleData: {
04.enable: true
05.},
06.showTitle:true//是否显示节点title信息提示 默认为true
07.key: {
08.title:"title" //设置title提示信息对应的属性名称 也就是节点相关的某个属性
09.}
10.}
11.};

这样一来,我们就可以达到我们想要的效果了。省略显示节点名称,鼠标移入时显示其节点的全称。效果图如下所示:

转:http://www.stepda.com/topic/?937

转:zTree树控件key配置之title:zTree树节点名称过长如何省略显示且鼠标移入节点上能够显示全称的更多相关文章

  1. MFC之树控件

    树控件对应的类: CTreeControl 树控件属性设置: 启用复选框:Check Boxes = True 父节点显示+-按钮:Has Button = True ; Lines At Roots ...

  2. 转:zTree树控件实战篇:针对多个下拉加载zTree树应该如何做出合理的配置

    今天有一个zTree的朋友遇到一个非常棘手的问题,才研究zTree树控件两天就被上头催着看成果,很是苦恼.他面对的问题就是页面内多个地方需要下拉在其文本框下方加载zTree树,由于对zTree下拉加载 ...

  3. 转:zTree树控件扩展篇:巧用zTree控件实现文本框输入关键词自动模糊查找zTree树节点实现模糊匹配下拉选择效果

    是否可以借助于zTree实现文本框输入关键词自动模糊匹配zTree下拉树,然后选择下拉树内节点显示在文本框内且隐藏下拉树. 看到这个需求脑子里头大致已经想到了要如何实现这样一个需求,当时是限于时间问题 ...

  4. 使用EasyUI的树控件构建Web界面

    最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...

  5. ExtJs控件属性配置详细

    序言:    1.本文摘自网络,看控件命名像是4.0以前的版本,但控件属性配置仍然可以借鉴(不足之处,以后项目用到时再续完善). Ext.form.TimeField: 配置项:            ...

  6. JS组件系列——Bootstrap 树控件使用经验分享

    前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天, ...

  7. WPF自定义控件与样式(9)-树控件TreeView与菜单Menu-ContextMenu

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 菜单M ...

  8. 基于MVC4+EasyUI的Web开发框架经验总结(2)- 使用EasyUI的树控件构建Web界面

    最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...

  9. 【转】WPF自定义控件与样式(9)-树控件TreeView与菜单Menu-ContextMenu

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等. 本文主要内容: 菜单Menu的自定义样式: 右键菜单ContextMenu的自定义样式 ...

随机推荐

  1. 树莓派通过GPIO控制步进电机

    一.接线方式与GPIO调用方法: 电源接入+5v和GND In1-4分别接GPIO1-4 正转时,GPIO1-4分次传入:[1,0,0,0],[sleep],[0,1,0,0],[sleep],[0, ...

  2. Linux实现多线程高速下载

    使用Wget下载,有时候速度挺慢的. 有没有好办法呢? 一.解决方案 安装axel 安装方法: yum -y install epel-release .el7.x86_64.rpm rpm -ivh ...

  3. mysql 俩个时间相减后取分钟

    CASE WHEN TIMESTAMPDIFF(MINUTE,o.createDate,o.chargingStartDate) != THEN 'APP解锁计费' ELSE '系统自动计费' END ...

  4. JAVA排序总结

    package com.softeem.jbs.lesson4; import java.util.Random; /** * 排序测试类 * * 排序算法的分类如下: * 1.插入排序(直接插入排序 ...

  5. JavaIO流原理之常用字节流和字符流详解以及Buffered高效的原理

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/5827509.html      Java的流体系十分庞大,我们来看看体系图:        这么庞大的体系里面 ...

  6. set-matrix-zeroes当元素为0则设矩阵内行与列均为0

    题目描述 Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. c ...

  7. Ajax学习(一)

    ajax是什么? Asynchronous Javascript And XML:异步的js和xml 他能使得js访问服务器,而且是异步的. 服务器给客户端的响应一般是整个页面,一个完整的html页面 ...

  8. Ubuntu18.04中配置QT5.11开发环境

    准备工作 参考 https://wiki.qt.io/Install_Qt_5_on_Ubuntu . # 安装g++ sudo apt install build-essential # sudo ...

  9. macbook 上安装git和将github作为托管服务器

    首先安装git,进入官网并下载:地址,下载后并安装,可以通过输入命令行,查看是否安装成功: sh-3.2# git --version git version 2.7.1 安装好后,我们来配置我们的g ...

  10. (原)PyTorch中使用指定的GPU

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/6836568.html PyTorch默认使用从0开始的GPU,如果GPU0正在运行程序,需要指定其他G ...