我仍然坚持这个问题。我想基于列分隔符从单个表中动态创建多个表。可以说,我在表中有11列,分隔符为3.因此,将有三个表有三列,第四个表有两列。我还想在每个表中重复标题。这是示例HTML表。
<table class="PrintTable">
<tr>
<td>
<table>
<thead>
<tr><th>Type Of Transaction</th></tr>
</thead>
<tbody>
<tr>
<td>Name</td>
</tr>
<tr>
<td>Age</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2006</th></tr>
</thead>
<tbody>
<tr>
<td>Andi</td>
</tr>
<tr>
<td>25</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2007</th></tr>
</thead>
<tbody>
<tr>
<td>tom</td>
</tr>
<tr>
<td>26</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2008</th></tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2009</th></tr>
</thead>
<tbody>
<tr>
<td>Horse</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2011</th></tr>
</thead>
<tbody>
<tr>
<td>Twinkle</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2012</th></tr>
</thead>
<tbody>
<tr>
<td>Haris</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2013</th></tr>
</thead>
<tbody>
<tr>
<td>LEno</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2014</th></tr>
</thead>
<tbody>
<tr>
<td>Jay</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
</tr>
预期产出
<table class="PrintTable">
<tr>
<td>
<table>
<thead>
<tr><th>Type Of Transaction</th></tr>
</thead>
<tbody>
<tr>
<td>Name</td>
</tr>
<tr>
<td>Age</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2006</th></tr>
</thead>
<tbody>
<tr>
<td>Andi</td>
</tr>
<tr>
<td>25</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2007</th></tr>
</thead>
<tbody>
<tr>
<td>tom</td>
</tr>
<tr>
<td>26</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2008</th></tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<table class="PrintTable">
<tr>
<td>
<table>
<thead>
<tr><th>Type Of Transaction</th></tr>
</thead>
<tbody>
<tr>
<td>Name</td>
</tr>
<tr>
<td>Age</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2009</th></tr>
</thead>
<tbody>
<tr>
<td>Horse</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2011</th></tr>
</thead>
<tbody>
<tr>
<td>Twinkle</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2012</th></tr>
</thead>
<tbody>
<tr>
<td>Haris</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<table class="PrintTable">
<tr>
<td>
<table>
<thead>
<tr><th>Type Of Transaction</th></tr>
</thead>
<tbody>
<tr>
<td>Name</td>
</tr>
<tr>
<td>Age</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2013</th></tr>
</thead>
<tbody>
<tr>
<td>LEno</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<thead>
<tr><th>2014</th></tr>
</thead>
<tbody>
<tr>
<td>Jay</td>
</tr>
<tr>
<td>28</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
任何帮助将不胜感激
答案 0 :(得分:1)
我做了一个功能(我认为)做你想做的事。这样称呼:
split_up_table(master_table, number_of_columns);
...它将返回一个新的较小表的数组。每个都有主表的头部,每个都有正确的列数。
答案 1 :(得分:1)
这是执行拆分的jQuery代码。这样做3列“while((j <3)...”,你可以把它变成一个函数并传入值。代码是相当自我解释的。不要忘记“clone()”方法到“复制并粘贴”而不是“剪切和粘贴”。
此致 尼尔
var printTable = $('table.PrintTable');
var printTableTds = $('table.PrintTable>tbody>tr>td');
var numberOfTds = $(printTableTds).size() - 1;
var tableHeader = $(printTableTds).eq(0);
var i = 1, j;
while (i < numberOfTds) {
newTable = $('<table class="printTable" />');
newTableBody = $('<tbody />').appendTo(newTable);
newTableRow = $('<tr />').appendTo(newTableBody);
$(tableHeader).clone().appendTo(newTableRow);
j = 0;
while ((j++ < 3) && (i <= numberOfTds)) {
$(printTableTds).eq(i++).clone().appendTo(newTableRow);
}
$(newTable).insertBefore(printTable);
}