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. January 07th, 2018 Week 01st Sunday

    To remember is to disengage from the present. 铭记过去就是放弃当下. To remember the past doesn't mean we would ...

  2. Spring boot+ maven + thymeleaf + HTML 实现简单的web项目

    第一步: 创建一个SpringBoot应用 第二步: 创建一个实体,用来存储数据,在src/main/java/com/example/first下创建包entity , 在entity下创建Pers ...

  3. ping 127.0.0.1和ping本地ip分别测试什么?

    ping 127.0.0.1 是你本地的回环地址! 实际上只要是127.0.0.1到127.255.255.255都是回环地址!都是可以PING检查的! 它能ping通,说明你的TCP/IP协议栈没问 ...

  4. Python 使用 xlwings 往 excel中写入一列数据的两种方法

    1.准备一个二维列表,然后再range后面不指定任何选项,可以输出该二维列表中数据在一列中显示,如下代码: # -*- coding:utf-8 -*- import xlwings as xw li ...

  5. localStorage 知识点

    先补充下localStorage 知识点:JS对象读取形式:localStorage.name添加/修改localStorage.name = "xuanyuan"其中" ...

  6. NOIP2018 AFO记

    仿佛"距NOIP2018还剩30天"的倒计时还在昨天,没想到这一天来的这么快. 考前在机房嘻嘻哈哈打打闹闹,开玩笑说道"我要AFO了",心里暗暗发誓做好自己,不 ...

  7. luogu P3809 【模板】后缀排序

    嘟嘟嘟 今天学了一个后缀数组,还是挺好理解的. 因为我不会基数排序,所以只会\(O(n \log ^ 2 n)\)的sort版. 首先,后缀数组就是把该字符串的所有后缀按字典序排序得到的一个数组.注意 ...

  8. 转://点评Oracle11g新特性之动态变量窥视

    1. 11g之前的绑定变量窥视 我们都知道,为了可以让SQL语句共享运行计划,oracle始终都是强调在进行应用系统的设计时,必须使用绑定变量,也就是用一个变量来取代原来出如今SQL语句里的字面值.比 ...

  9. Android学习之基础知识五—Android常用的七大控件

    一.TextView控件:在界面上显示一段文本信息 先看XML代码和执行效果:         代码分析: 1.android:id属性,给当前控件定义了一个唯一的标识符 2.android:layo ...

  10. elasticsearch6.1 安装问题

    问题:Caused by: java.lang.RuntimeException: can not run elasticsearch as root [root@localhost logs]# a ...