<
div class="zTreeC"><div class="searchL" lay-filter="searchL" style="background:none;"><form class="layui-form clearF"><div class="input-group input-group-sm float-left" style="margin-left:5px;"><div class="layui-input-inline"><input id="keyword" name="" tag="" class="layui-input" type="text" placeholder="请输入名称搜索" autocomplete="off"/></div></div><div class="float-right minor-btns"><button type="button" id="search" class="btn btn-pr btn-sm publicButton">搜索</button></div></form></div><div id="treeNode" class="ztree "></div></div>
js 第一种 点击查询按钮执行
//条件搜索 节点选中并显示信息$("#search").click(searchNodes);function searchNodes(){
vartreeObj = $.fn.zTree.getZTreeObj("treeNode");
varkeyword=$("#keyword").val();
varnodes = treeObj.getNodesByParamFuzzy("name", keyword,null);//根据节点数据的属性搜索,获取条件模糊匹配的节点数据 JSON 对象集合,(keywords)模糊匹配只能针对 String 类型的数据for(vari = nodes.length-1; i >= 0; i--) {
treeObj.selectNode(nodes[i]); //会让节点自动滚到到可视区域内 }
//显示第一个选中的节点信息dataItemId = nodes[0].id;
fun.search();//查询节点信息的方法
}
第二种 去掉查询按钮, input框变化就执行
document.getElementById("keyword").addEventListener("input", test,false);functionsearchNodes(){vartreeObj = $.fn.zTree.getZTreeObj("treeNode");
varkeywords=$("#keyword").val();
varnodes = treeObj.getNodesByParamFuzzy("name", keywords,null);
for(var i = nodes.length-1; i >= 0; i--) { treeObj.selectNode(nodes[i]);//会让节点自动滚到到可视区域内}
//显示第一个选中的节点信息dataItemId = nodes[0].id;
fun.search();//查询节点信息的方法
}
searchNodes方法与其他ztree的方法是平级的
版权声明:
作者:弓长张&木子李
出处:http://www.cnblogs.com/gczmn/
需要获取海量最新BATJ视频资料加群:345353515 备注(简书)