树呢是一个最简单的树，并没有做一异步加载，也就是一个筛选，然后跳到第一个符合删选的数据下，并且所有符合的都会被展开和选中。其中ztreeAry是一个模拟的本地数组json。在test.json中，如果需要你可以自己创建一个。

<html>

<head>
<meta charset="utf-8">
<title>ztree 筛选</title>
<link rel="stylesheet" href="zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript" src="test.json"></script>
<script type="text/javascript">
$(function() {
var setting = {
data: {
simpleData: {
enable: true,
idKey: "id",
pIdKey: "parentId",
rootPId: -1
},
key: {
url:"nourl",
name:"name"
}
}
};
var zTreeObj=$.fn.zTree.init($("#treeDemo"), setting,ztreeAry);
// zTreeObj.expandAll(true);
});

//搜索框
$(function() {
$('#sch').keydown(function(e) {
if(e.keyCode==13){
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
var value = $('#sch').val();
var nodeList = treeObj.getNodesByParamFuzzy('name', value);
treeObj.cancelSelectedNode();
var nodes = treeObj.getNodes();
for(var j=0;j<nodes[0].children.length;j++){
treeObj.expandNode(nodes[0].children[j], false, true, false);
}
if(value){
if (nodeList.length>0) {
for(var i=0;i<nodeList.length;i++){
treeObj.expandNode(nodeList[i], true, false, false);
treeObj.selectNode(nodeList[i],true);
}
}
}
}
});
});
</script>
</head>
<body>
搜索:<input type="text" id="sch" placeholder="回车定位">
<br> 树状：
<div style="height:300px;width:200px;">
<ul id="treeDemo" class="ztree"></ul>
</div>
</body>
</html>

ztree模糊筛选展开选中节点的更多相关文章

  1. ztree根据treeId展开指定节点并触发单击事件

    ztree.expandNode(ztree.getNodeByParam("id",treeId,null));//展开指定节点 ztree.selectNode(ztree.g ...

  2. 【ztree】回显选中节点

    // treeId是元素id,array是数据数组 var ztree = $.fn.zTree.init($("#treeId"), setting, array); // 获取 ...

  3. 【zTree】zTree展开树节点

    今天在做zTree树的时候想着将第一级tree展开,于是利用下面方法: /** * 展开树节点的第一层 */ function openFirstTreenode(){ // 获取树对象 var tr ...

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

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

  5. 把zTree前的展开收起图标改为三角形，且只有在点击三角形图标时才展开子节点解决方案

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...

  6. zTree勾选状态的禁用节点不在选中节点里

    问题描述: 由于业务需求,需要将一部分节点设置为选中并且是禁用的状态.设置这部分节点的chkDisabled和checked属性值都为true.在zTree树上这部分节点是选中且禁用的状态,但是在保存 ...

  7. zTree实现获取当前选中的第一个节点在同级节点中的序号

    zTree实现获取当前选中的第一个节点在同级节点中的序号 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTr ...

  8. zTree根据json选中节点，并且设置其他节点不可选

    首先,在适配目录树时,使用checkbox形式,配置代码如下: var settingCatalog = { check:{ enable: true }, data:{ simpleData:{ e ...

  9. Devexpress TreeList 展开和折叠当前选中节点

    1.展开: private void barButtonItem6_ItemClick(object sender, DevExpress.XtraBars.ItemClickEventArgs e) ...

随机推荐

  1. LJN数理化生信奥队自传

    LJN数理化生信奥队, 原名“LJN信奥队”,简称“ljnoit”. 联系方式: QQ:3046036317 QQ群:555088375 (Offical群) 701124785 (Vip群) 邮箱: ...

  2. ES6 memo

    一.热门问题 介绍redux,主要解决什么问题 是管理应用程序状态的库,解决数据管理和数据通信的问题 Promise.Async有什么区别 Async 更简洁,不需要用 then 连接 Promise ...

  3. c/c++面试题一

    1.找错 void test1() { char string[10]; char *str1="0123456789"; strcpy(string,str1); } 试题一字符 ...

  4. 网络相关配置，SSH服务，bash, 元字符

    作业一:临时配置网络(ip,网关,dns)+永久配置  设置IP和掩码ifconfig eth0 192.168.2.2 netmask 255.255.255.0设置网关route add defa ...

  5. 为django项目配置celery的后台启动

    为root用户启动celery创建的脚本,该脚本的拥有者与使用者都必须是root .使用方法为 /etc/init.d/celeryd [start]|[stop]|[kill] 需增加两个文件 /e ...

  6. git冲突解决的几种办法

    文章目录 git stash 栈 放弃本地修改 撤销分支 强行冲掉之前的分支 删除分支 git stash 栈 git stash git pull git stash pop 当pull出现冲突时 ...

  7. maven生命周期和插件详解

    生命周期 什么是生命周期? maven的生命周期就是对所有的构建过程进行抽象和统一.maven从大量项目和构建工具中总结了一套高度完善的.易扩展的生命周期.这个生命周期包含项目的清理.初始化.编译.测 ...

  8. oralce执行计划

    看懂Oracle执行计划   最近一直在跟Oracle打交道,从最初的一脸懵逼到现在的略有所知,也来总结一下自己最近所学,不定时更新ing… 一:什么是Oracle执行计划? 执行计划是一条查询语句在 ...

  9. hosts 添加主机和ip映射

    背景:在服务器搭建环境时,迁移项目后,停止服务出现以下问题. 原因:项目停止或启动找不到映射名称或服务. 解决:修改hosts文件.hosts文件地址 /etc/hosts         添加主机和 ...

  10. 使用datepicker和uploadify的冲突解决（IE双击才能打开附件上传对话框）

    在开发的过程当中,IE的兼容无疑是我们的一块绊脚石,在我们使用的如期的datepicker插件和使用上传附件的uploadify插件的时候,两者就产生冲突,只要点击过时间的插件,uploadify上传 ...