这里有新鲜出炉的精品教程,程序狗速度看过来!
zTree 是一个依靠 jQuery 实现的多功能 "树插件"。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。专门适合项目开发,尤其是 树状菜单、树状数据的 web 显示、权限管理等等。
这篇文章主要为大家详细介绍了如何基于 cookie 实现 zTree 树刷新后,展开状态不变,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
基于 cookie 实现 zTree 树刷新后,展开状态不变。
1、除了引用 jQuery 和 zTree 的 JS 外,引用 cookie 的 JS:
<script type="text/javascript"src="~/Scripts/jquery-treeview/lib/jquery.cookie.js"></script>
2、JS 代码:
- $(function () {
- //ztree设置
- var setting = {
- data: {
- simpleData: {
- enable: true,
- idKey: "id",
- pIdKey: "pId",
- rootPId: null
- }
- },
- callback: {
- onExpand: onExpand,
- onCollapse: onCollapse
- }
- };
- $.ajax({
- type: "POST",
- url: "/Tech/TemplateTypeManage/GetData",
- success: function (data) {
- if (data && data.length != 0) {
- $.fn.zTree.init($("#tree"), setting, data);
- var treeObj = $.fn.zTree.getZTreeObj("tree");
- var cookie = $.cookie("z_tree" + window.location);
- if (cookie) {
- z_tree = JSON2.parse(cookie);
- for (var i = 0; i < z_tree.length; i++) {
- var node = treeObj.getNodeByParam('id', z_tree[i])
- treeObj.expandNode(node, true, false)
- }
- }
- }
- }
- });
- });//end $
- function onExpand(event, treeId, treeNode) {
- var cookie = $.cookie("z_tree" + window.location);
- var z_tree = new Array();
- if (cookie) {
- z_tree = JSON2.parse(cookie);
- }
- if ($.inArray(treeNode.id, z_tree) < 0) {
- z_tree.push(treeNode.id);
- }
- $.cookie("z_tree" + window.location, JSON2.stringify(z_tree))
- }
- function onCollapse(event, treeId, treeNode) {
- var cookie = $.cookie("z_tree" + window.location);
- var z_tree = new Array();
- if (cookie) {
- z_tree = JSON2.parse(cookie);
- }
- var index = $.inArray(treeNode.id, z_tree);
- z_tree.splice(index, 1);
- for (var i = 0; i < treeNode.children.length; i++) {
- index = $.inArray(treeNode.children[i].id, z_tree);
- if (index > -1) z_tree.splice(index, 1);
- }
- $.cookie("z_tree" + window.location, JSON2.stringify(z_tree))
- }
来源: http://www.phperz.com/article/17/0505/327232.html