js实现树形内容展示
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实现树形内容展示的更多相关文章
- Winform开发主界面菜单的动态树形列表展示
我在之前很多文章里面,介绍过Winform主界面的开发,基本上都是标准的界面,在顶部放置工具栏,中间区域则放置多文档的内容,但是在顶部菜单比较多的时候,就需要把菜单分为几级处理,如可以在顶部菜单放置一 ...
- 将数据库中的内容展示出来并将某些value值转换成汉字
1.将数据库中的内容展示出来 前台代码未做改变,刚开始未显示的原因是因为 data-field 跟数据库不一样data-field 需要跟数据库中的一样才可以 2.将某些value值转换成汉字 在li ...
- 微信小程序小技巧系列《二》show内容展示,上传文件编码问题
作者:gou-tian 来自:github show内容展示 尝试用微信小程序的template组件实现.同时,尝试页面间转跳时传参,在目标页面引入模板文件实现 写的更少,做的更多 篇幅有限详细代码此 ...
- Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化
Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...
- js对文章内容进行分页示例代码
这篇文章主要介绍了使用js对文章内容进行分页的具体实现,需要的朋友可以参考下 Thinkphp中文章显示代码: 代码如下: <div id="showContent"> ...
- 如是使用JS实现页面内容随机显示
之前有个客户咨询我,因为他们公司的业务员有多个人,但公司网站的联系方式板块里只够放一个人的信息,所以就想能不能实现这个联系方式信息随机显示,对于业务或客服人员来说也能做到分配均匀公平.本文我们将和大家 ...
- 安卓ListView行详细内容展示页编写和下拉刷新实现
ListView行详细内容展示页: 使用轻量级的Fragment实现Listview行内容简单的详细信息展示: 值得注意的是: 1. 主布局(打开它的Activity)必须是FrameLayout布局 ...
- Node.js读取文件内容
原文链接:http://blog.csdn.net/zk437092645/article/details/9231787 Node.js读取文件内容包括同步和异步两种方式. 1.同步读取,调用的是r ...
- JS控制页面内容
JS操作页面内容 innerText:普通标签内容(自身文本与所有子标签文本)innerHTML:包含标签在内的内容(自身文本及子标签的所有)value:表单标签的内容outerHTML:包含自身标签 ...
随机推荐
- asp.net core中使用HttpClient实现Post和Get的同步异步方法
准备工作 1.visual studio 2015 update3开发环境 2.net core 1.0.1 及以上版本 目录 1.HttpGet方法 2.HttpPost方法 3.使用示例 4. ...
- EasyUI tabs指定要显示的tab
<div id="DivBox" class="easyui-tabs" style="width: 100%; height: 100%;& ...
- 解决input框黄色背景问题(转)
input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset !important;} <form action="l ...
- Django之知识总结
1. 课程介绍 - 数据类型 - 函数 - 面向对象三大特性:继承,封装,多态 - socket:本质传输字节:所有网络通信都基于socket - 数据库设计:单表.FK.M2M (自己作业:自己领域 ...
- 月球美容计划之最小生成树(MST)
寒假学的两个算法,普里姆,克鲁斯卡尔最终弄明确了.能够发总结了 先说说普里姆,它的本质就是贪心.先从随意一个点開始,找到最短边,然后不断更新更新len数组,然后再选取最短边并标记经过的点,直到全部的点 ...
- API--ResponseBody-类
import com.fasterxml.jackson.annotation.JsonInclude; import com.fasterxml.jackson.annotation.JsonInc ...
- MyISAM to InnoDB: Why and How(MYSQL官方译文)
原文地址:https://www.mysql.com/why-mysql/presentations/myisam-2-innodb-why-and-how/ MySQL使用一个插拔式的存储引擎架构, ...
- The Cat in the Hat POJ - 1289
题意:给你来两个数A,B .其中A=(n+1)k, B=nk 输出:(nk-1)/(n-1) 和 ∏ (n+1)k-i ni 思路:关键就是怎么求n和k.本来想这n一定是几个质因数的乘积,那 ...
- Excel函数详解:[127]ROWS函数用法
函数说明 1 函数语法: ROWS(array) 2 参数说明: array:表示要返回行数的数组.数组公式或单元格引用. END 函数实例-计算项目的数量 在B12单元格中输入公式“=ROWS( ...
- esp8266(2) 智能配置
http://www.arduino.cn/thread-46594-1-1.html http://blog.csdn.net/sadshen/article/details/47049129 ht ...