0

我有一张带有两个表格标题的表格<th>。我需要使用 jquery 表排序对两个不同的集合进行排序。

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="listtable">
 <thead>
  <tr>
   <th>Heading Set1 - A</th>
   <th>Heading Set1 - B</th>
   <th>Heading Set1 - C</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
  </tr>
 </tbody>
  <thead>
  <tr>
   <th>Heading Set2 - A</th>
   <th>Heading Set2 - B</th>
   <th>Heading Set2 - C</th>
  </tr>
  </thead>
 <tbody>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  </tbody>
  </table>

排序单个 TH 的脚本如下：

$(function() 
{ 

  $(".listtable").tablesorter({ 

  sortList : [[1,0]], 

  widgets: ["zebra", "columns"], 

  widgetOptions: { 
    columns: [ "primary", "secondary", "tertiary" ], 
    columns_thead : true, 
    columns_tfoot : true 
 } 

 });

我可以对一组 TH 进行排序，但我需要在现有表中添加另一组 TH 和 TBODY。我的脚本不允许对单个表中的两个集合进行排序。

4

2 回答 2

0

我找到了这个参考，但我在W3C 建议中找不到确切的措辞。它说每张桌子只允许一张桌子thead和一张桌子。tfoot多个tbody's 很好。

因此，不要使用两个thead，只需将其替换为 atbody并添加类tablesorter-infoOnly，以便插件忽略内容。像这样：

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="listtable">
    <thead>
        <tr>
            <th>Heading Set1 - A</th>
            <th>Heading Set1 - B</th>
            <th>Heading Set1 - C</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
    <tbody class="tablesorter-infoOnly">
        <tr>
            <th>Heading Set2 - A</th>
            <th>Heading Set2 - B</th>
            <th>Heading Set2 - C</th>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
</table>
于 2012-11-11T07:47:39.810 回答
0

试试这个插件，

http://datatables.net/release-datatables/examples/basic_init/multi_col_sort.html

DataTables 允许您同时按多列排序。DataTables 还提供了一种方法来添加您自己的排序函数，以扩展那些内置到 DataTables 中的排序函数。如果您希望对数据格式（例如货币和非 JavaScript 标准日期格式）进行排序（这种自然排序算法很流行），这将非常有用。

于 2012-11-09T06:48:01.623 回答