ztree 官网的中的 Search Nodes 例子中,所有菜单都是连着的,如果出现某个菜单下无子节点,那么在搜索时,此节点便不会自动展开,这里给出对应的增强版代码
rush:js;">
var setting = {
data: {
key: {
title: "t"
},simpleData: {
enable: true
}
},view: {
fontCss: getFontCss
}
};
var zNodes =[
{ id:1,pId:0,name:"系统参数",open:true},{ id:11,pId:1,name:"通用参数"},{ id:111,pId:11,name:"状态A"},{ id:112,name:"状态B"},{ id:12,name:"日志"},{ id:121,pId:12,name:"操作类型"},{ id:122,name:"操作结果"},{ id:1221,pId:122,name:"操作结果1"},{ id:1222,name:"操作结果2"},{ id:12221,pId:1222,name:"操作结果21"},{ id:12222,name:"操作结果22"},{ id:12223,name:"操作结果23"},{ id:2,name:"业务参数",{ id:21,pId:2,name:"工单类型"},{ id:22,name:"监控类型"},{ id:23,pId:22,name:"监控子类型1"},{ id:24,name:"监控子类型2"},{ id:25,pId:24,name:"监控子子类型1"},{ id:26,name:"监控子子类型2"},];
var lastValue = '',nodeList = [],fontCss = {};
function searchNode(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
var value = $.trim(key.val());
lastValue = value;
//zTree.expandAll(true);
$('#treeDemo').html("");
$.fn.zTree.init($("#treeDemo"),setting,zNodes);
if (value != "") {
nodeList = zTree.getNodesByParamFuzzy("name",value);
} else {
nodeList = zTree.getNodesByParamFuzzy("name","|||||||||||||||");
}
updateNodes(true);
}
var parentNode = [];
function updateNodes(highlight) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
parentNode = [];
for( var i=0,l=nodeList.length; inormal"};
}
var key;
$(document).ready(function(){
$.fn.zTree.init($("#treeDemo"),zNodes);
key = $("#search_name");
key.bind("blur",searchNode);
});
效果图
以上所述是小编给大家介绍的ztree搜索中多级菜单展示不全的解决方法。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。