本插件基于jQuery1.6开发,插件版本:1.0 

前言:

    树形结构的应用非常广泛,像windows的资源管理器、微软(CSDN/搜狐)论坛等无一例外地,都使用了树形结构展示内容分类的层次关系。
    在采用HTML元素效果显示上,一般使用table、div、ul几种方式。table的兼容性强,设置的CSS样式少,但是不够灵活,尤其是分类数据量大时,使用table的字节比实际内容还多;div虽然灵活,但是设置的CSS样量是很大的,微软社区的分类采用DIV+table方式;UL或div在用CSS时如果使用margin或padding缩进表显层次关系,会在FF和IE不同版本上会得到不同效果,而且层次结构越深,就越容易产生错节现象。
    本插件采用ul结构,使用图片填充的方式增加缩进距离。这样可以用少量的CSS定义,而设计出超强兼容性和灵活精致的树形展示。

1、生成树形HTML结构

由一个包含树形结构数据的外围容器开始,其下子元素ul就是树形的第一级。
在树形结构内部,“span”标记只被允许用于含有子节点的节点元素上,其他地方不允许使用。

2、插件功能

2.1、animated:”fast”
设置展开子节点时的显示速度,一般有slow、normal、fast几个值,与jQuery的hide(show)中的speed参数相似。

2.3、collapsed: true

初始化时的折叠状态。true,初始化为收缩节点状态;false,与前相反。

2.4、unique: true

展开同级节点的唯一性。true,当展开一个节点时,同级的其他节点会自动关闭;false,当展开一个节点时,同级的其他节点保持原形,不做为。

3、相关资源

QQ:276652878
QQ技术群:7809122  (群共享里有最新的插件等资源更新,轻松获取,即时关注)
邮箱:feihusky2008@qq.com
交流社区:www.jishu.me(网站未上线,筹备中)
百度空间:http://hi.baidu.com/jishume

注:因作者才疏学浅,难免会有出错或遗漏的不足,敬请各位朋友不吝赐教,及时反馈。

下载地址:http://files.cnblogs.com/jishume/feihutree.rar             或 到 QQ技术群的共享文件中下载。

 

 

 

制作人:飞虎                                           无兄弟不编程!

====================================================

 

欢迎加QQ群进行更多交流:305397511     专注于php、mysql以及开源框架

 

版权声明:本文为jishume原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/jishume/articles/2053982.html