<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">
$(function(){
$("tr[aa='aa']").bind("click", function(){
var display = $(this).attr('display');
if (display == 'block'){
$('tr[pid='+$(this).attr('id')+']').hide();
$(this).removeAttr('display');
}else{
$('tr[pid='+$(this).attr('id')+']').show();
$(this).attr('display','block');
}
})
})
</script>
</head>
<body>
<table border="1" cellSpacing="0" cellPadding="0">
<thead>
<tr>
<td>姓名</td>
<td>日期</td>
<td>金额</td>
<td>说明</td>
</tr>
</thead>
<tbody>
<tr id="11" aa="aa">
<td colspan ="4">
Common
</td>
</tr>
<tr pid="11" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr pid="11" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr id="12" aa="aa">
<td colspan ="4">
Action
</td>
</tr>
<tr pid="12" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr pid="12" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr id="13" aa="aa">
<td colspan ="4">
TransAction
</td>
</tr>
<tr pid="13" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr pid="13" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr id="14" aa="aa">
<td colspan ="4">
Action
</td>
</tr>
<tr pid="14" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr pid="14" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr id="15" aa="aa">
<td colspan ="4">
Workflow
</td>
</tr>
<tr pid="15" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
<tr pid="15" style="display:none;">
<td>A股</td>
<td>A股</td>
<td>A股</td>
<td>A股</td>
</tr>
</tbody>
</table>
</body>
<!-- http://www.yto.net.cn/cn/service/index.html -->
</html>
分享到：
相关推荐
实现在表格中显示树形结构，支持动态添加，删除。 花了10个小时终于写出来了。 贴出来分享一下。 包含封装后的成品和封装前源代码。
自己闲余时间，参考dTree全新改写了一个可自由配置表格树，可复选，样式也可以自己定义。使用相当方便。如果在使用上有问题，或者有什么好的建议都可以留言。
强大的jquery 表格树 如果不处理，默认显示的是一个普通表格
采用jquery编写的一个表格树插件，具有单击行、双击行、右键列、固定头部、固定左侧等功能
本设计源码提供了一个基于Layui的表格树形结构展示组件，包含53个文件，其中包括24个js脚本文件，5个css样式文件，4个md文档，4个json数据文件，3个gif图片文件，2个png图片文件，2个php源文件，2个html页面文件，...
项目用的前端组件推荐，包含表单验证、表格、弹窗、时间选择、文件上传、下拉树、下拉框等
支持懒加载，解决了大数据量显示效率的问题； 提供表格树回调接口，方便实现自己的业务； 优化以前表格树代码，并且公开源码。
支持懒加载，解决了大数据量显示效率的问题； 提供表格树回调接口，方便实现自己的业务； 优化以前表格树代码，并且公开源码。
懒加载版本表格树
java的swing表格树示例
继承asp.net的DataGrid控件实现的表格树控件 /*表格树控件说明 * 此控件继承DataGrid 新增属性说明： * 1.TreeParentCode:顶级根节点parentcode * 2.TreeDisplayDeep:展现表格树深度默认为1 * 3.SumColumns:...
基于layui的表格树插件,实现异步加载表格树，适用于大数据量的树型表格。项目中正好用到了，记录一下。。
table表格转表格树，总结得一个方法
jquery 表格树
jquery web 前台 编辑器 日历 表格 表单 表格树 图表 的一些开源组件
extjs 可编辑的表格树，每个单元格自定义编辑组件，可以自适应列宽，只有源码与例子，运行实例要修改路径，不然图片不能显示，注意etree.jsp的js引入路径 支持Ext2.x以上版本 如运行不了EmailTo ： codeme9@gmail....
基于Jquery的表格树插件，可自定义图标，支持各类js事件，支持打开、关闭所有节点等功能
boostrapTable表格树，官网上有，但是如果未来方便也可以下载，毕竟js和css齐全可以直接运行出效果
jquery插件表格树GridTree--2011新年版本