jquery - 使用 jQuery tablesorter.js 避免/禁用排序过程中的某些特定行

Question

我有一张表，我正在使用 jquery 插件 tablesorter 进行排序。在这里，我想避免在选择任何列进行排序时对第一行 {class="avoid-sort" } 进行排序。例子：

---

       <thead>
        <tr>
            <th class="header">#</th>
            <th class="header">Purchase Date</th>
            <th class="header">Course Name</th>
            <th class="header">Amount(in $)</th>
            <th class="header">User Name</th>
            <th class="header">Share</th>
            <th class="header">Net Revenue [$236.41]</th>
        </tr>
      </thead>
  <tbody>

       <tr class="avoid-sort">
            <th colspan="7">Total Revenue</th>
            <td>236.41</td>
        </tr>

        <tr>
                <td>1</td>
                <td>January 3rd, 2013</td>
                <td>Tackle Certification</td>
                <td>50</td>
                <td>Khushi Jha</td>
                <td>35</td>
                <td>33.69</td>
        </tr>
      <tr>
                <td>2</td>
                <td>January 3rd, 2013</td>
                <td>Flag Certification</td>
                <td>100</td> 
                <td>Pay</td>
                <td>70</td>
                 <td>67.67</td>
      </tr>
                            <tr>
                <td>3</td>
                <td>January 3rd, 2013</td>
                <td>Tackle Certification</td>
                <td>50</td>
                <!--                    <td>-->
                    <!--</td>-->
                <td>Pay</td>
                <td>35</td>
                 <td>33.69</td>

   </tr>

---

tr class="avoid-sort" 不应该出现在排序中！

请帮忙！！

Answer 1

你有两个选择：

1. 如果您使用的是原始的 tablesorter，您可以让这个静态行小部件将行“锁定”到位。

2. 如果您使用我的 tablesorter 分支，您可以添加一个不可排序的 tbody，如下所示（演示）：

   <table>
   <thead>
     ...
   </thead>
   
   <!-- rows within this tbody are ignored -->
   <tbody class="avoid-sort">
     <tr>
       <th colspan="7">Total Revenue</th>
       <td>236.41</td>
     </tr>
   </tbody>
   
   <tbody>
     <!-- sortable rows -->
     <tr>
       ...
     </tr>
   </tbody>
   </table>
   

   然后像这样初始化表：

   $(function() { 
   
     $("table").tablesorter({ 
       theme : 'blue', 
       cssInfoBlock : "avoid-sort", 
       widgets: [ 'zebra' ] 
     }); 
   
   });
   

Answer 2

在Mottie 的 fork中，staticRow插件现在是内置的：

<script src="/js/tablesorter/jquery.tablesorter.min.js"></script>
<script src="/js/tablesorter/widgets/widget-staticRow.min.js"></script>
<!-- … -->
<tr class="static">…&lt;/tr>

$("table").tablesorter({
    widgets: ['staticRow']
})

或者，您可以设置自定义类名：

<tr class="tablesorter-static">…&lt;/tr>

$("table").tablesorter({
    widgets: ['staticRow'],
    widgetOptions: {
        // Note it expects a CSS selector, not a raw class name
        staticRow_class: ".tablesorter-static"
    }
})

Answer 3

$(function() {     
$("#myTable").tablesorter({
        headers: {4: {sorter: false},8: {sorter: false}}
    });
});

这里 4,8 是列号。列以 0 开头