上一篇
下一篇
jquery 树形菜单Treeview插件
作者:亮亮 日期:2009-07-16
首先当然是引入相关的文件：
jq框架文件
插件文件：jquery.treeview.js
样式文件：jquery.treeview.css
接着就是写树形菜单的结构代码了：
程序代码<ul id="tree1">
<li><span>顶层1</span>
<ul>
<li><span><a href="?1.1">顶层1.1</a></span></li>
</ul>
</li>
<li><span>顶层2</span></a>
<ul>
<li><span><a href="?2.1">顶层2.1</a></span></li>
<li><span>顶层2.2</span>
<ul>
<li><span><a href="?2.2.1">顶层2.2.1</a></span></li>
<li><span><a href="?2.2.2">顶层2.2.2</a></span></li>
</ul>
</li>
</ul>
</li>
<li>顶层3</li>
<li>顶层4</li>
</ul>
最后就是javascript代码了，很简单
程序代码<script type="text/javascript">
$(document).ready(function(){
$("#tree1").treeview({
persist: "location",
collapsed: true,
unique: true
});
});
</script>
好了，一个树形菜单就做成了，看看效果
现在简单说说几个常用的参数：
引用内容animated 动画效果
collapsed 开始的时候是否都是折叠的，true 折叠 false 展开状态
unique 同一层次只允许同时展开一个
persist location或cookie，设置为cookie时可保存tree的状态
cookieId persist设置为cookie的话就设置cookie名称
注意：若要设置cookie时，还要引入cookie插件文件jquery.cookie.js
最后看看其他样式的树形菜单
代码下载
文章来自: 
引用通告: 
Tags: 评论: 0 | 引用: 0 | 查看次数: -
发表评论
