1.首先这里有一个demo,里边有封装好的js文件。地址:http://files.cnblogs.com/files/feifeishi/dtree.zip

2.直接上代码

<div style="height:auto;margin-left: 20px;">  

                  <s:iterator value="targetlist">
<input type="text" style="display:none" value="<s:property value="id.targetnumber.trim()"/>" class="targetnumber">
</s:iterator>
<s:iterator value="requirementlist">
<input type="text" style="display:none" value="<s:property value="id.requirementnumber.trim()"/>" class="requirementnumber">
</s:iterator>
<s:iterator value="pointlist">
<input type="text" style="display:none" value="<s:property value="id.pointnumber.trim()"/>" class="pointnumber">
</s:iterator> <script type="text/javascript">
d = new dTree('d');
d.add(0,-1,'培养要求树');
d.add(10,0,'培养要求');
$('.targetnumber').each(function(){
d.add(this.value,10,'培养目标'+this.value,'Target4.action?targetnumber='+this.value+'', '', 'main');
});
$('.requirementnumber').each(function(){
d.add(this.value,this.value.substring(0,1),'毕业要求'+this.value,'Point.action?requirementnumber='+this.value+'', '', 'main');
});
$('.pointnumber').each(function(){
d.add(this.value,this.value.substring(0,2),'指标点'+this.value,'PointPoint.action?requirementnumber='+this.value+'', '', 'main');
});
document.write(d); </script>

  前半部分的s标签是获得action中传过来的list的值,从而使js可以使用这些值。js中是写树的节点,打印树。

3.效果截图:

4.文件中有一个api,其中有重要的参数信息

js实现树形内容展示的更多相关文章

  1. Winform开发主界面菜单的动态树形列表展示

    我在之前很多文章里面,介绍过Winform主界面的开发,基本上都是标准的界面,在顶部放置工具栏,中间区域则放置多文档的内容,但是在顶部菜单比较多的时候,就需要把菜单分为几级处理,如可以在顶部菜单放置一 ...

  2. 将数据库中的内容展示出来并将某些value值转换成汉字

    1.将数据库中的内容展示出来 前台代码未做改变,刚开始未显示的原因是因为 data-field 跟数据库不一样data-field 需要跟数据库中的一样才可以 2.将某些value值转换成汉字 在li ...

  3. 微信小程序小技巧系列《二》show内容展示,上传文件编码问题

    作者:gou-tian 来自:github show内容展示 尝试用微信小程序的template组件实现.同时,尝试页面间转跳时传参,在目标页面引入模板文件实现 写的更少,做的更多 篇幅有限详细代码此 ...

  4. Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化

    Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...

  5. js对文章内容进行分页示例代码

    这篇文章主要介绍了使用js对文章内容进行分页的具体实现,需要的朋友可以参考下 Thinkphp中文章显示代码: 代码如下: <div id="showContent"> ...

  6. 如是使用JS实现页面内容随机显示

    之前有个客户咨询我,因为他们公司的业务员有多个人,但公司网站的联系方式板块里只够放一个人的信息,所以就想能不能实现这个联系方式信息随机显示,对于业务或客服人员来说也能做到分配均匀公平.本文我们将和大家 ...

  7. 安卓ListView行详细内容展示页编写和下拉刷新实现

    ListView行详细内容展示页: 使用轻量级的Fragment实现Listview行内容简单的详细信息展示: 值得注意的是: 1. 主布局(打开它的Activity)必须是FrameLayout布局 ...

  8. Node.js读取文件内容

    原文链接:http://blog.csdn.net/zk437092645/article/details/9231787 Node.js读取文件内容包括同步和异步两种方式. 1.同步读取,调用的是r ...

  9. JS控制页面内容

    JS操作页面内容 innerText:普通标签内容(自身文本与所有子标签文本)innerHTML:包含标签在内的内容(自身文本及子标签的所有)value:表单标签的内容outerHTML:包含自身标签 ...

随机推荐

  1. Hbase-2.0.0_03_Hbase数据模型

    1. hbase数据模型 1.1. HBase数据模型术语 Table HBase表由多行组成. Row HBase中的一行由一个行键和一个或多个列组成,列的值与这些列相关联.存储行时,按行键按字母顺 ...

  2. Alpha冲刺! Day8 - 砍柴

    Alpha冲刺! Day8 - 砍柴 今日已完成 晨瑶:写了部分gitkraken团队协作教程:讨论关于继承baseActivity因为需要参数无法通过override去实现函数,并且initData ...

  3. 阿里八八β阶段Scrum(5/5)

    今日进度 陈裕鹏: 简单信息抽取编码完成 叶文滔: 处理了信息抽取编码的一些BUG,修复了日程界面不会自动更新添加的日程的BUG,修改了原先测试用的TAG以及数据分析部分数据计算数值错误的问题 王国超 ...

  4. QT数据类型

    typedef signed char        int8_t;typedef short              int16_t;typedef int                int3 ...

  5. oracle远程物化视图

    一.创建远程物化视图日志 源端: CREATE MATERIALIZED VIEW LOG ON tozwdb.test tablespace tozwdb_data WITH ROWID; 二.付权 ...

  6. scp传输文件的命令

    scp传输文件的命令 一:scp常规的使用方式: scp可以进行简单的远程复制文件的功能.它是一个在各个主机之间进行复制或文件传输的一个命令工具.它使用一种同ssh一样的安全机制来进行文件的传输. 注 ...

  7. ARM汇编语言基础

    ARM 与 Thumb 寄存器对应关系 PC寄存器: ARM状态为R15,Thumb状态为PC LR寄存器: ARM状态为R14,Thumb状态为LR SP寄存器: ARM状态为R13,Thumb状态 ...

  8. 浅谈传感器常用Delta-SigmaADC

    过采样ADC,或噪声整形ADC,也叫Delta-Sigma ADC.名字很多,基本上都由求差电路,积分求和电路组成调制器,后续由数字滤波器获得Nbit数字输出.不管怎样,数学上的除法能够让你理解这类A ...

  9. 简单的策略模式Strategy演示

    策略模式,即规则在变化之中,结果终归为一. 公司给员工计算工资,如有加班费,差旅费,每个月的生活补帖等等其它费用需要计算.这个费的规则是不尽相同. 不管策略的规则怎样,终归需要计算出一个结果 工资: ...

  10. Unexpected error from external database driver (1)

    当尝试把Excel导入SQL时,发生此异常: Unexpected error from external database driver (1). 在网上查找到一个解决方法,网址http://dat ...