Question

我想在使用tablesorter时禁用表格中第一列的排序。我希望它始终保持与开始时相同，即使其他列已经排序。我怎样才能做到这一点？

实施例： http://www.w3schools.com/html/html_tables.asp 查看数字列。我希望它始终保持不变，而其他列可以正确排序。

Answer 1

您可以在排序后通过简单的循环为第一列中的行重新编号。为每行的第一个TD分配一个类似于“行号”的类，然后遍历行号并对其重新编号。

您的HTML

<table class=sortable>
  <tr><th>Row</th><th>Column 1</th><th>Column 2</th></tr>
  <tr><td class=rownumber>1</td><td>Data 1</td><td>Data 2</td></tr>
  <tr><td class=rownumber>2</td><td>Data 1</td><td>Data 2</td></tr>
  <tr><td class=rownumber>3</td><td>Data 1</td><td>Data 2</td></tr>
  <tr><td class=rownumber>4</td><td>Data 1</td><td>Data 2</td></tr>
  <tr><td class=rownumber>5</td><td>Data 1</td><td>Data 2</td></tr>
</table>

您的jQuery

if ($('.sortable').find("tr").size() > 1){  // If table has at least 1 row
  $('.sortable').tablesorter({              // Initialize table sorter
    sortList: [[0,0]]                       // Sort on first column by default
  })
  .bind("sortStart",function() {            // Bind to sortStart
    $('.rownumber').each(function() {       // For each rownumber class
      $(this).html('');                     // Blank out the row number
    });
  })
  .bind("sortEnd",function() {              // Bind to sortEnd
    var newnumber = 1;                      // Start with #1
    $('.rownumber').each(function() {       // For each rownumber class
      $(this).html(newnumber++);            // Re number the rows
    });
  });
}

使用jQuery Tablesorter.js排序其他列时，防止第一列中的值重新排序

1 个答案: