我只能使用一个标签'tr'制作一张像这张照片的桌子吗？

Question

我排序表使用libray“tablesorter js”但是如果我使用2或更多'tr'如上图所示，那么库将不起作用。所以我只需要写'tr'

是否可以制作？

Answer 1

您需要两个tr来创建所需的表格结构。

原始tablesorter包含cssChildRow选项，默认情况下设置为"expand-child"。 It isn't documented，但您可以see a demo here。以下是a demo它的工作原理，但正如您所看到的，您无法对第二列进行排序。

HTML

<tr>
  <td colspan="2">Lamp</td>
</tr>
<tr class="expand-child">
  <td>Burn Time</td>
  <td>150 Hours</td>
</tr>

脚本

$(function() {
  $('table').tablesorter({
    cssChildRow: "expand-child"
  });
});

在我的fork of tablesorter中，您仍然可以设置cssChildRow option，但默认设置已更改为"tablesorter-childRow"。它会自动处理子行中的额外列，而无需对HTML或脚本进行任何更改 - demo。