由简入繁实现Jquery树状结构
由简入繁实现Jquery树状结构 在项目中，我们经常会需要一些树状结构的样式来显示层级结构等，比如下图的样式，之前在学.net的时候可以直接拖个服务端控件过来直接使用非常方便。但是利用Jquery的一些插件，也是可以实现这些效果的，比如说Jquery.treeview.js插件。 下面就直入主题，开始从简入繁的分析怎么使用treeview插件，从已知的知识开始轻松入手，让树状结构唾手可得。 显示树状结构的几个实现步骤： 一、HTML做初始静态原型。 首先通过<ul></ul><li></li>展示树状基本结构，还原其最初的样子： 相信学过一点HTML的同学都可以实现吧，在“tree.html”中写如下代码： <ul> 2 <li>系统管理 3 <ul> 4 <li>部门管理</li> 5 <li>岗位管理 6 <ul> 7 <li>岗位添加</li> 8 <li>岗位删除</li> 9 </ul> 10 </li> 11 <li><用户管理 12 <ul> 13 <li>添加用户</li> 14 <li>修改用户</li> 15 </ul> 16 </li> 17 </ul> 18 </li> 19 <li>审批流转</li> 20 </ul> 我们静态的树形结构的草本如下： 二、加入treeview插件库，实现动态树状结构。