$(function () {
创新互联是一家专注网站建设、网络营销策划、小程序开发、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立十载以来,已经为1000多家橡塑保温各业的企业公司提供互联网服务。现在,服务的1000多家客户与我们一路同行,见证我们的成长;未来,我们一起分享成功的喜悦。
$("#btn_bianli").click(function () {
var showlist = $("ul/ul");
showall(menulist.menulist, showlist);
$("#div_menu").append(showlist);
});
});
//menu_list为json数据
//parent为要组合成html的容器
function showall(menu_list, parent) {
for (var menu in menu_list) {
//如果有子节点,则遍历该子节点
if (menu_list[menu].menulist.length 0) {
//创建一个子节点li
var li = $("li/li");
//将li的文本设置好,并马上添加一个空白的ul子节点,并且将这个li添加到父亲节点中
$(li).append(menu_list[menu].MName).append("ul/ul").appendTo(parent);
//将空白的ul作为下一个递归遍历的父亲节点传入
showall(menu_list[menu].menulist, $(li).children().eq(0));
}
//如果该节点没有子节点,则直接将该节点li以及文本创建好直接添加到父亲节点中
else {
$("li/li").append(menu_list[menu].MName).appendTo(parent);
}
}
}
zTree的jquery树插件就可以生成树了。
1、setting 配置信息说明
普通使用,无必须设置的参数
与显示相关的内容请参考 API 文档中 setting.view 内的配置信息
name、children、title 等属性定义更改请参考 API 文档中 setting.data.key 内的配置信息
2、treeNode 节点数据说明
标准的 JSON 数据需要嵌套表示节点的父子包含关系
例如:
var nodes = [
{name: "父节点1", children: [
{name: "子节点1"},
{name: "子节点2"}
]}
];
默认展开的节点,请设置 treeNode.open 属性
无子节点的父节点,请设置 treeNode.isParent 属性
其他属性说明请参考 API 文档中 "treeNode 节点数据详解"
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。
zTree 是开源免费的软件(MIT 许可证)。如果您对 zTree 感兴趣或者愿意资助 zTree 继续发展下去,可以进行捐助。
你不必自己做了 jquery有很多插件实现树状分支,只要去jquery网查查插件就有了。可以推荐你一个ztree 国产的,功能十分丰富强大。我项目里也是用的它。