最近做了一个简单的功能,树节点的搜索。ztree的版本的2.0,3.X以上的版本请百度解决办法。

1、在setting中增加

function getFontCss(treeId, treeNode) {
return (!!treeNode.highlight) ? {color:"#A60000", "font-weight":"bold"} : {color:"#333", "font-weight":"normal"};
}

后台生成树的代码中 需要添加一个 自定义属性 highlight,其值为 false、

2、页面上需要定义一个input和一个搜索按钮, 下面的方法是 按钮的点击方法。

function changeColor(searchConditionId){
updateNodes(false);
if($('#dicKey').val() != ""){
updateNodes(false);
var nodeList = zTree.getNodesByParamFuzzy("name", $('#dicKey').val());
if(nodeList && nodeList.length>0){
updateNodes(true);
} }else{
updateNodes(false);
}
}
//更新树节点  入参是一个布尔值    这个方法是 节点 的颜色改变还是 还原
function updateNodes(highlight) {
var nodeList = zTree.getNodesByParamFuzzy("name", $('#dicKey').val());
for( var i=0; i<nodeList.length; i++) {
nodeList[i].highlight = highlight;
zTree.updateNode(nodeList[i]);
}
}

上面主要用到的方法:

获取 名字包含“测试”字符串 的全部节点数据

var zTreeObj = zTree(setting, zTreeNodes);
var nodes = zTreeObj.getNodesByParamFuzzy("name", "测试");

修改了节点 (treeNode1) 的名称后,在 zTree 上进行更新

var zTreeObj = zTree(setting, zTreeNodes);
......
treeNode1.name = "test Name";
zTreeObj.updateNode(treeNode1, true);

具体的用法可以 查看 帮助文档。

尚未实现的是 自动定位到 查找的到 树节点(或者add  remove 节点) 。

返回div顶部的代码是

$('#tree_div').animate({scrollTop:0},200);

ztree 2.0 节点搜索的更多相关文章

  1. ztree树 叶子节点路径的集合

    1.Question Description: ztree树各个节点都带有路径,如“/根节点”,"/根节点/一级节点",“根节点/一级节点/二级节点‘; 现在想获取所选的最末级节点 ...

  2. zTree中父节点禁用,子节点可以用

    参考学习网址:http://www.treejs.cn/v3/main.php#_zTreeInfo zTree中父节点禁用,子节点可以用 axios.get('/base/unit/unittree ...

  3. ztree获取选中节点时不能进入可视区域出现BUG如何解决

    zTree 是一个依靠 jQuery 实现的多功能 “树插件”.优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. zTree 的特点编辑 ● zTree v3.0 将核心代码按照功能进 ...

  4. JPA,EclipseLink 缓存机制学习(一) 树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  5. ztree 获取子节点所有父节点的name的拼接

    ztree 获取子节点所有父节点的name的拼接 //获取子节点,所有父节点的name的拼接字符串function getFilePath(treeObj){if(treeObj==null)retu ...

  6. JPA,EclipseLink 缓存机制学习——树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  7. zTree分批异步加载方式下实现节点搜索功能(转载)

    原文地址:https://segmentfault.com/a/1190000004657854 最近公司做一个项目用到zTree,zTree功能强大就不用多说了,相信用过的人都知道.       公 ...

  8. ztree 获取根节点

    function getRoot() { var treeObj = $.fn.zTree.getZTreeObj("tree-div"); //返回一个根节点 var node ...

  9. zTree重命名节点时,操作的那个dom(类似input框那个)怎么写

    <script type="text/javascript"> //tree的编辑节点的方法 ztree.editName(nodeNew[0]); /// $(&qu ...

随机推荐

  1. RocketMQ源码分析之RocketMQ事务消息实现原理中篇----事务消息状态回查

    上节已经梳理了RocketMQ发送事务消息的流程(基于二阶段提交),本节将继续深入学习事务状态消息回查,我们知道,第一次提交到消息服务器时消息的主题被替换为RMQ_SYS_TRANS_HALF_TOP ...

  2. js开发中常用小技巧

    1.获取指定范围内的随机数 function getRadomNum(min,max){ return Math.floor(Math.random() * (max - min + 1)) + mi ...

  3. Numpy 索引及切片

    1.一维数组的索引及切片 ar = np.arange(20) print(ar) print(ar[4]) print(ar[3:6]) print(ar[:4:2]) #索引到4 按2的步长 pr ...

  4. chrome 切换到其他网络后重新加载网

    chrome 突然提示 “您与 www.google.com 之间的安全连接目前正受到干扰.  请等待几分钟后再尝试重新加载网页,或在切换到其他网络后重新加载网” 查看证书发现 已经过期 解决:同步下 ...

  5. Maven学习 (六) 搭建多模块企业级项目

    首先,前面几次学习已经学会了安装maven,如何创建maven项目等,最近的学习,终于有点进展了,搭建一下企业级多模块项目. 好了,废话不多说,具体如下: 首先新建一个maven项目,pom.xml的 ...

  6. 2016年后web开发趋势是什么?

    2016 年后 Web开发趋势是什么 来源:yafeilee.me 发布时间:2016-05-06 阅读次数:1378 3   近二年的进展 前端发展日新月异, 甚至有一句戏言: "每六星期 ...

  7. VSX-4 VSXTra

    要介绍VSXTra项目不是一个简单的事情. 而且要在上面进行扩展,删减就更不容易. 源码分析的资料几乎没有,可怜的几个示例项目,相较而言,英文已经不是阻碍我前进的步伐了. 本篇只是简单的分析,对于已经 ...

  8. 新生 & 语不惊人死不休 —— 《无限恐怖》读后有感

    开篇声明,我博客中“小心情”这一系列,全都是日记啊随笔啊什么乱七八糟的.如果一不小心点进来了,不妨直接关掉.我自己曾经写过一段时间的日记,常常翻看,毫无疑问我的文笔是很差的,而且心情也是瞬息万变的.因 ...

  9. HUAWEI TAG-AL00 找IMEI的过程

    前几天,遇到一台华为机型,IMEI获取有问题,然后就找了一下. 以下是解决过程,权当记录一下,尽管为知笔记已经有备份了 :) 0x01: 起因 测试小哥发现,一台机型IMEI获取不全,有问题,拨号页面 ...

  10. MySQL隐式转换测试

      Preface       There're various data type in MySQL such as number,string,date,time,lob,etc.The data ...