具有两个标题行的表排序器 [英] tablesorter with two header rows

查看:58
本文介绍了具有两个标题行的表排序器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 tablesorter jquery插件,并且我的表的标题中有两行.有什么方法可以对我的桌子进行排序吗?它应该能够按第二个标题行排序,而第一个标题行恰好可以按日期对相关数据进行分组.如果使用此插件无法做到这一点,那么可能有人建议解决方法?

I am using the tablesorter jquery plugin and my table has two rows in the header. Is there any way to enable sorting on my table? it should be able to be sortable by the second header row the first header row is just there to group related data by a date. If this is not possible using this plugin maybe someone has a suggestion for a workaround?

这是我的表格标记的一个示例

Here is an example of my table markup

<table>
  <thead>
    <tr>
      <th colspan="3">January</th>
      <th colspan="3">February</th>
      <th colspan="3">March</th>
    </tr>
    <tr>
      <!-- January -->
      <th>Metric 1</th>
      <th>Metric 2</th>
      <th>Metric 3</th>
      <!-- February -->
      <th>Metric 1</th>
      <th>Metric 2</th>
      <th>Metric 3</th>
      <!-- March -->
      <th>Metric 1</th>
      <th>Metric 2</th>
      <th>Metric 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <!-- January -->
      <td>Value 1</td>
      <td>Value 2</td>
      <td>Value 3</td>
      <!-- February -->
      <td>Value 1</td>
      <td>Value 2</td>
      <td>Value 3</td>
      <!-- March -->
      <td>Value 1</td>
      <td>Value 2</td>
      <td>Value 3</td>
    </tr>
    <tr>...</tr>
    <tr>...</tr>
    <!-- etc -->
  </tbody>
<table>

推荐答案

您要做的就是尝试;)

http://jsfiddle.net/Mottie/4mVfu/402/

如果要禁用第一行,请在这些标头单元格中添加sorter-false类:

If you want the top row disabled, then add a sorter-false class to those header cells:

<tr>
  <th class="sorter-false" colspan="3">January</th>
  <th class="sorter-false" colspan="3">February</th>
  <th class="sorter-false" colspan="3">March</th>
</tr>

http://jsfiddle.net/Mottie/4mVfu/403/

这篇关于具有两个标题行的表排序器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆