Rus*_*l G 5 jquery tablesorter
我正在尝试使用jQuery Tablesorter插件来处理嵌套表,其中内部表和外部表都是可排序的.外部表的每一行通常包含一个按钮,单击时,显示该行只在它下面隐藏的内表(虽然我跳过下面为简便起见,HTML按钮,使一切最初可见).
内部表与一个"expand-child"类相连,它告诉Tablesorter在排序时将它与它上面的行保持在一起.这主要是有效的,但是外部表格标题在单击时没有正确突出显示,并且内部表格根本没有正确排序.
我知道这个问题,并且一个解决方案是禁用内部表上的排序,但我特别希望外表和内表都可以排序.
我的HTML在下面,我还创建了一个显示问题的jsfiddle.谢谢你的帮助.
<table class="tablesorter">
<thead>
<tr>
<th>Make</th>
<th>Model</th>
</tr>
</thead>
<tbody>
<tr>
<td>Honda</td>
<td>Accord</td>
</tr>
<tr class="expand-child">
<td colspan="2" style="padding: 0 30px 0 30px;">
<table class="tablesorter">
<thead>
<tr>
<th>Doors</th>
<th>Colors</th>
</tr>
</thead>
<tbody>
<tr>
<td>Honda 2-Door</td>
<td>Honda Red</td>
</tr>
<tr>
<td>Honda 4-Door</td>
<td>Honda Blue</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>Toyota</td>
<td>Camry</td>
</tr>
<tr class="expand-child">
<td colspan="2" style="padding: 0 30px 0 30px;">
<table class="tablesorter">
<thead>
<tr>
<th>Doors</th>
<th>Colors</th>
</tr>
</thead>
<tbody>
<tr>
<td>Toyota 2-Door</td>
<td>Toyota Yellow</td>
</tr>
<tr>
<td>Toyota 4-Door</td>
<td>Toyota Green</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
Run Code Online (Sandbox Code Playgroud)