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

首先,我们要在树的节点内多增加一个属性用于设置该节点的全称,这里我们以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. linux2.6.30.4内核移植(4)——完善串口驱动

    在内核里支持两个串口,也就是芯片的UART0和UART1,而UART2的驱动是针对红外接口的,而不是串口驱动,这里将其修改为串口驱动. 一.修改内核源码arch/arm/mach-s3c2440/ma ...

  2. 前端安全系列(一):如何防止XSS攻击?

    原文:https://my.oschina.net/meituantech/blog/2218539 前端安全 随着互联网的高速发展,信息安全问题已经成为企业最为关注的焦点之一,而前端又是引发企业安全 ...

  3. cocos2d-js 3.0 rc2 自定义UI控件组件 例子:能播放动画的MenuItem。MenuItemSprite的bug

    其实总体自定义UI组件都比较简单,尤其是cocos2d-js是开源的,如果有什么不明白的直接看js代码或者C++代码即可.当然js代码基本就够了. 另外,js的ctor函数虽然说是构造函数,但毕竟不是 ...

  4. JDK提供的四种线程池

    一.线程池什么时候用,有什么好处? “线程池”顾名思义,就是存放线程的池子,这个池子可以存放多少线程取决于采用哪种线程池,取决于有多少并发线程,有多少计算机的硬件资源.使用线程池最直接的好处就是:线程 ...

  5. java AES加密、解密(兼容windows和linux)

      java AES加密.解密 CreationTime--2018年7月14日10点06分 Author:Marydon 1.准备工作 updateTime--2018年8月10日15点28分 up ...

  6. MySQL Replication主从复制环境下修改主库IP

    因为调整服务器子网, 数据库服务器的IP地址需要修改. 这个过程中, 需要确保的就是从库在断开主库后, 能从正确的位置再次启动. 具体的操作步骤如下 1) 需要获取的前提信息: 主库的新IP, 这在启 ...

  7. 【laravel5.* + 钉钉实现WEB第三方登录】 使用redis 作为持久化存储

    1.去钉钉开发者平台>自助者工具,创建扫码登录授权应用,填写名称.描述.授权页面logo地址(这个图片最后会出现在用户扫码设备中,建议使用压缩图片减少用户加载时间).回调域名(一般都是写一个子域 ...

  8. android中巧妙更改spinner、AutoCompleteTextView分割线的颜色值(spinner AutoCompleteTextView divider color)

    这个问题本来是个不大的问题,但是遇到了就会很郁闷,Android控件的api本身就不太够强大,这个小属性找了好久没找到,今天终于解决,分享给所有遇到这个问题的朋友. spinner下拉列表中间有一条黑 ...

  9. MySQL的INSERT ··· ON DUPLICATE KEY UPDATE使用的几种情况

    在MySQL数据库中,如果在insert语句后面带上ON DUPLICATE KEY UPDATE 子句,而要插入的行与表中现有记录的惟一索引或主键中产生重复值,那么就会发生旧行的更新:如果插入的行数 ...

  10. EntityFramework 5.0 CodeFirst 教程01-搭建环境和快速上手

    ----------------------------目录------------------------------ EntityFramework 5.0 CodeFirst 教程03-数据结构 ...