`

JQUERY 实现无限极TREEVIEW

阅读更多

第一步:下载JQUERY和TREEVIEW插件。
JQUERY:http://jquery.bassistance.de/dist/jquery.js
TREEVIEW:http://jquery.bassistance.de/treeview/jquery.treeview.zip(注意:解压后里面的DEMO是不能正常显示的,因为缺少jquery.js。大家下载下来放到相应目录即可)

第二步:创建一个HTML文件
因为我们要利用一些图片资源,所以就在jquery.treeview.zip解压以后的目录里面创建。
例如我们创建一个treeview.html文件。用你喜欢的编辑器写以下的代码


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>TREEVIEW</title>
这里是引入jquery.js文件,我上面已经提过原来的压缩包是没有的,下载以后复制进去即可。
<script type="text/javascript" src="jquery.js"></script>
这里是引入treeview插件
<script type="text/javascript" src="jquery.treeview.js"></script>
下面这个是jquery的语法格式,不懂的可以到上面看我给的那些入门资料。
<script type="text/javascript">
$(function(){
$("ul").Treeview();

});
</script>
以下是一些CSS样式,这里是必须的。大家可以根据自己的喜好来改它的外观,这也是我特别欣赏 的地方
<style type="text/css">

.treeview, .treeview ul {
padding: 0;
margin: 0;
list-style: none;
}

.treeview li {
margin: 0;
padding: 4px 0 3px 20px;
}

.treeview li { background: url(images/tv-item.gif) 0 0 no-repeat; }
.treeview .collapsable { background-image: url(images/tv-collapsable.gif); }
.treeview .expandable { background-image: url(images/tv-expandable.gif); }
.treeview .last { background-image: url(images/tv-item-last.gif); }
.treeview .lastCollapsable { background-image: url(images/tv-collapsable-last.gif); }
.treeview .lastExpandable { background-image: url(images/tv-expandable-last.gif); }

</style>


</head>
<body>

大家可以根据自己的要求改下面的这些代码,只要结构按照html语言里的列表结构即可。

<ul>
<li>Item 1
<ul>
<li>Item 1.1</li>
</ul>
</li>
<li class="closed">Item 2 (如果CLASS指定了closed,那么他默认是关闭的)
<ul>
<li>Item 2.1
<ul>
<li>Item 2.1.1</li>
<li>Item 2.1.2</li>
</ul>
</li>
<li>Item 2.2</li>
</ul>
</li>
<li>Item 3</li>
</ul>


</body>
</html>

分享到:
评论
1 楼 cssuger 2011-11-22  
不懂的话不要买官子了,你这是啥,你真的懂这个树了吗?

相关推荐

    ASP.net c# 无限极树菜单

    在ASP.NET中,可以使用控件如TreeView来实现这个效果。TreeView控件提供了构建层次结构视图的功能,可以展示数据源(如数据库)中的层次关系。 1. **数据源与数据绑定**: - 数据源:通常来自数据库,如SQL Server...

    asp.net无限极树的测试

    总结,ASP.NET中的无限极树实现主要依赖于TreeView控件,通过绑定数据源、处理节点操作事件以及优化性能策略,我们可以构建出高效、功能完善的无限极树。在实际项目中,结合webTest这个示例,你可以进一步研究和实践...

    html简单易懂树形无限极。

    此外,JavaScript库如jQuery UI、Bootstrap的TreeView插件、Angular的ng-tree等,提供了丰富的功能和易于使用的API,使得在HTML中构建具有交互性的无限级树形结构变得非常便捷。这些库通常支持异步加载、节点拖放、...

    java+Struts+Hibernate实现的无限级树菜单

    前端通常使用JavaScript库(如jQuery、Bootstrap Treeview、AngularJS等)来呈现树形结构。这些库提供了方便的API来动态加载和操作树节点。在本项目中,可能会利用JSP页面结合JavaScript来渲染树形菜单。 6. **...

    22T挖掘机回转减速器设计说明书.doc.doc

    22T挖掘机回转减速器设计说明书.doc.doc

    步进式推刚机设计说明书.doc

    步进式推刚机设计说明书.doc

    《单片机技术》课程设计说明书 8x8x8的光立方设计.docx

    《单片机技术》课程设计说明书 8x8x8的光立方设计.docx

    累加平均算法verilog

    累加平均算法verilog

    时间序列预测中SVM、BP神经网络与LSTM的应用及MATLAB实现

    内容概要:本文详细介绍了支持向量机(SVM)、BP神经网络和LSTM网络在时间序列预测中的应用及其MATLAB实现。首先,针对SVM部分,文章讲解了如何将时间序列数据转化为特征矩阵并通过滑动窗口进行预测,强调了交叉验证的重要性。对于BP神经网络,则着重于数据归一化以及网络结构的选择,并指出BP网络容易陷入局部最优的问题。最后,在LSTM部分,文章展示了如何利用MATLAB的深度学习工具箱实现LSTM网络,解决了输入数据格式转换的问题,并实现了滚动预测。文中提供了具体的代码示例,确保读者能够轻松替换数据源并运行程序。 适用人群:适用于有一定MATLAB基础的时间序列预测初学者和技术爱好者。 使用场景及目标:帮助读者掌握三种不同类型的机器学习模型在时间序列预测任务中的具体应用,理解各自的特点和优缺点,从而选择合适的模型应用于实际项目中。 其他说明:文章不仅提供了详细的理论解释,还给出了完整的代码实现,使得读者可以直接上手实践。同时,作者提醒了一些常见的错误和注意事项,如数据格式、归一化等问题,有助于提高预测准确性。

    基于S7-200 PLC与组态王的花式喷泉控制系统设计及其实现

    内容概要:本文详细介绍了利用S7-200 PLC和组态王构建智能花式喷泉控制系统的设计思路和技术细节。首先阐述了喷泉系统的基本构成,包括硬件部分如PLC、喷嘴及其连接方式,以及软件部分如喷嘴控制逻辑、喷泉变换逻辑和控制画面设计。接着展示了具体的梯形图接线图和代码实现,解释了关键变量的作用和程序流程。最后讨论了系统测试与调试的方法,强调了硬件配置、IO分配、通信配置等方面的注意事项,并分享了一些实用技巧。 适合人群:对工业自动化感兴趣的工程技术人员,特别是从事PLC编程和组态软件应用的从业者。 使用场景及目标:适用于需要设计和实施智能喷泉控制系统的项目,旨在提高喷泉展示的效果和管理效率。通过学习本文,读者可以掌握如何使用PLC和组态王创建复杂的喷泉控制系统,实现多样化的喷水模式。 其他说明:文中提供了丰富的实践经验,包括常见问题的解决方案和优化建议,有助于读者更好地理解和应用相关技术。同时,附带的实际案例使理论更加生动具体,便于理解和模仿。

    基于S7-200 PLC的饮料灌装机控制系统设计与实现

    内容概要:本文详细介绍了基于西门子S7-200 PLC的饮料灌装机控制系统的设计与实现。首先阐述了硬件设计,包括瓶体输送、定位检测、液体灌装、计数统计等环节的具体配置,如CPU224搭配EM221数字量扩展模块及其I/O分配。接着深入解析了梯形图程序的核心代码,涵盖系统启停控制、灌装流程控制以及产量统计等功能模块。此外,还展示了如何利用WinCC Flexible进行组态画面设计,实现了动态液位显示、实时计数器和电磁阀状态指示灯等功能。最后分享了一些调试过程中遇到的实际问题及解决方案,如接近开关接线错误、电磁阀动作引起的输出抖动等问题,并提出了效率优化技巧。 适合人群:从事PLC编程、自动化控制系统的工程师和技术人员,尤其是对西门子S7-200系列PLC感兴趣的读者。 使用场景及目标:适用于饮料行业或其他类似行业的灌装生产线控制系统开发项目。目标是帮助读者掌握S7-200 PLC在实际生产环境中的应用方法,提高系统的稳定性、可靠性和效率。 其他说明:文中不仅提供了详细的理论讲解,还包括了许多实用的经验分享和注意事项,有助于读者更好地理解和应用于实际工作中。同时,对于初学者而言,可以作为学习PLC编程和控制系统设计的良好参考资料。

    6156铝合金平板对接焊焊接工艺及夹具设计 设计说明书.doc

    6156铝合金平板对接焊焊接工艺及夹具设计 设计说明书.doc

    中兴U30高级web后台app

    中兴U30高级web后台app

    基于LABVIEW的西门子PLC数据采集处理程序设计与实现

    内容概要:本文详细介绍了一款基于LABVIEW开发的通用型PLC通讯与数据处理程序。该程序主要用于与西门子PLC进行通讯,完成数据采集、存储、回放、处理及报警显示等功能。文中具体介绍了各个功能模块的实现方法和技术要点,包括OPC协议通讯、内存和CSV文件存储、数据回放与处理、报警逻辑等。此外,作者还分享了一些开发过程中遇到的问题及其解决方案。 适合人群:从事工业自动化领域的工程师、技术人员,尤其是熟悉LABVIEW和PLC编程的专业人士。 使用场景及目标:适用于需要进行工业数据采集和处理的各种项目,旨在帮助开发者快速构建稳定可靠的数据采集系统,提高工作效率。 其他说明:文中提供了详细的代码示例和注意事项,有助于读者更好地理解和应用相关技术。同时,该程序具有良好的扩展性和灵活性,可以根据具体需求进行定制化开发。

    Realtek PCIe GBE Family Controller网卡驱动程序 v2.1 Win7 or above

    老网卡驱动程序,给老电脑老系统(XP,WIN7等)留存备用啦

    新能源汽车领域的电动汽车方案详解:涵盖BMS、电机控制与PCB设计

    内容概要:本文详细介绍了最新的电动汽车设计方案,涉及电池管理系统(BMS)、电机控制以及PCB设计等方面。文中首先展示了高压平台的BMS控制板及其采用的Rust语言实现的主动均衡算法,该算法通过移动平均替代传统阈值判断,提高了均衡效率。接着讨论了电机控制部分,特别是FOC算法的实现细节,强调了硬件设计中的关键组件选择和布局技巧,如MOSFET驱动电路和DC-Link电容的放置。此外,文章还探讨了CAN总线通信协议的应用,确保各模块间稳定的数据传输。最后提到了一些实用的设计建议,如热管理和防呆设计等。 适合人群:从事新能源汽车研究与开发的专业人士,尤其是对电动汽车硬件设计和软件实现感兴趣的工程师。 使用场景及目标:帮助读者深入了解电动汽车的关键技术和设计理念,为实际项目提供理论支持和技术指导。同时,也为初学者提供了入门级别的理解和实践方法。 其他说明:文章不仅包含了详细的代码示例和技术解析,还附带了一些实用的小贴士,如硬件防护措施和设计注意事项。

    (整理)平压印刷机运动方案和主要机构设计课程设计说明书.doc

    (整理)平压印刷机运动方案和主要机构设计课程设计说明书.doc

    蛋壳清洁机设计说明书.pdf

    蛋壳清洁机设计说明书.pdf

    二氧化硫填料吸收塔设计_毕业设计说明书.doc

    二氧化硫填料吸收塔设计_毕业设计说明书.doc

    三相与单相整流仿真:基于双闭环PI控制、SVPWM及PLL的应用与优化

    内容概要:本文详细探讨了三相和单相整流仿真中的关键技术,重点介绍了双闭环PI控制、空间矢量脉宽调制(SVPWM)以及锁相环(PLL)的应用。文章首先解释了三相整流中的电压外环和电流内环的作用机制,强调了电流内环PI参数调节的重要性,并提供了具体的MATLAB代码示例。接着讨论了PLL在电网电压跌落情况下的表现及其改进方法,如采用二阶广义积分器(SOGI)结构提高稳定性。对于SVPWM部分,则讲解了扇区判断逻辑和波形生成的具体步骤,指出调制比过高会导致波形畸变的问题并提出解决方案。此外,还涉及了单相整流中SPWM的实现方式,包括虚拟正交生成和电流环设计,以及如何应对二次谐波干扰。最后,文章总结了一些实用的经验和技术要点,如参数整定、仿真步长选择等。 适合人群:从事电力电子研究的技术人员、高校相关专业师生、对电力电子控制系统感兴趣的工程师。 使用场景及目标:适用于希望深入了解三相和单相整流仿真原理的研究者,旨在帮助他们掌握双闭环控制、SVPWM和PLL的实际应用技巧,从而更好地进行系统设计和故障排除。 其他说明:文中不仅包含了详细的理论分析,还附有大量的代码片段供读者参考实践,有助于加深理解和提高动手能力。同时提醒读者关注一些常见的陷阱和注意事项,确保仿真结果更加可靠。

Global site tag (gtag.js) - Google Analytics