Question

我要求只对表中的特定行进行排序。我使用tablesorter插件进行排序（http://mottie.github.io/tablesorter/js/jquery.tablesorter.js）

我在jsbin编写的例子。

此时，当用户选择复选框时，相应的行将预先添加到表格的顶部。当取消选中所选复选框时，相应的行将附加到表中。

现在，未选择的行未排序。我的要求是，每当取消选中该复选框并将该行附加到表时，必须按字母顺序对未选择的行进行排序。

Answer 1

这应该适合你（demo）：

<table id="ex" class="tablesorter">
  <thead>
    <th class="sorter-false"></th>
    <th>Name</th>
    <th>Contribution</th>
  </thead>
  <!-- add an "info" only (non-sorting) tbody -->
  <tbody class="tablesorter-infoOnly"></tbody>

  <tbody class="names">
    <tr>
      <td><input type="checkbox" /></td>
      <td>Warren Buffet</td>
      <td>business</td>
    </tr>
    <!-- etc -->
  </tbody>
</table>

代码

$(function() {

  $("#ex").tablesorter({ sortList: [[0,0], [1,0]] });

  $('#ex').on('click', 'input:checkbox', function() {
    var $this = $(this);
    if ($this.is(':checked')) {
      $this.closest('tr').prependTo("#ex .tablesorter-infoOnly");
    } else {
      $this.closest('tr').appendTo("#ex .names");
    }
    $this.trigger('update');
  });
});

“names”tbody中未检查行的实际位置（追加）无关紧要，因为它将被添加回来并且当前排序将被更新。

对表中的特定行进行排序+ HTML + jQuery

1 个答案: