我想制作多级表格,如:
+-----+-----+-------+------+---------+
| lv1 | lv2 | name | date | value|
+-----+-----+-------+------+---------+
| - lv1: 1 |
|------------------------------------|
| - lv2: 1 |
|------------------------------------|
| 1 | 1 | John |01/01 | 100.0|
+-----+-----+-------+------+---------+
| 1 | 1 | John |01/01 | 100.0|
|------------------------------------|
| - lv2: 2 |
|------------------------------------|
| 1 | 2 | John |01/01 | 100.0|
+-----+-----+-------+------+---------+
| + lv1: 2 |
|------------------------------------|
| + lv2: 1 |
|------------------------------------|
| + lv2: 2 |
|------------------------------------|
| + lv2: 3 |
|------------------------------------|
| + lv1: 3 |
|------------------------------------|
| + lv1: 4 |
|------------------------------------|
这样的东西..我试过这样但我不知道这是不是正确的方法:
<table>
<thead>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>- Lv1:1</td>
</tr>
<tr>
<td> - Lv2:1</td>
</tr>
<tr>
<th>1</th>
<th>1</th>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<th>1</th>
<th>1</th>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td> -Lv2:2</td>
</tr>
<tr>
<th>1</th>
<th>2</th>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td>+ Lv1:2</td>
</tr>
<tr>
<td> + Lv2:1</td>
</tr>
<tr>
<td> + Lv2:2</td>
</tr>
<tr>
<td> + Lv2:3</td>
</tr>
<tr>
<td>+ Lv1:3</td>
</tr>
<tr>
<td>+ Lv1:4</td>
</tr>
</tbody>
</table>
即使我可以使用jQuery进行折叠/展开。另外,我要提一下,我想从JSON或数组创建此表。请告诉我这是否正确,以及如何从object / array生成此表..
答案 0 :(得分:1)
我认为你在这里寻找的是colspan
这将允许您为<tr>
元素设置不同的宽度..虽然可以为这些元素设置动画(听起来像是你,你需要一个javascript / jquery解决方案
我在这里设置了一个小提琴来演示:http://jsfiddle.net/wdwogvon/
这与你想要完成的事情类似吗?