Question

Tablesorter和jQuery

我将http://tablesorter.com/docs/用于项目。

信息

我已将两个列标题合并/ colspaned为一个。这意味着缺少对第三列的一种排序。

的jsfiddle

http://jsfiddle.net/RqN8a/18/

问题

我可以强制将最后一列的排序添加回merged / colspaned标题吗？

HTML（如果jsFiddle不起作用）

<p>
<strong>This works</strong>
</p>

<table class="tablesorter">
<thead>
<tr>
    <th>Heading1</th>
    <th>Heading2</th>
    <th>Heading3</th>
</tr>
</thead>
<tbody>
<tr>
    <td>Data1a</td>
    <td>Data2a</td>
    <td>Data3a</td>
</tr>
    <tr>
    <td>Data1b</td>
    <td>Data2b</td>
    <td>Data3b</td>
</tr>
</tbody>
</table>

<p>
    <strong>Can this work?</strong><br>
    Another arrow should be added for sorting the "Data3" column
</p>

<table class="tablesorter">
<thead>
<tr>
    <th>Heading1</th>
    <th colspan="2">?   Heading2</th>
</tr>
</thead>
<tbody>
    <tr>
       <td>Data11</td>
       <td>Data2c</td>
       <td>Data3a</td>
    </tr>
    <tr>
        <td>Data12</td>
        <td>Data2b</td>
        <td>Data3b</td>
    </tr>
    <tr>
        <td>Data13</td>
        <td>Data2a</td>
        <td>Data3c</td>
    </tr>
</tbody>
</table>

内联jQuery（如果jsFiddle不起作用）

$(document).ready(function() { 
    $("table").tablesorter({ 
    }); 
});

Answer 1

据我所知，没有必要改变太多。

只需更改您的第二个HTML，如下所示： -

<table class="tablesorter2">
    <thead>
        <tr>
            <th rowspan="2">Heading1</th>
            <th colspan="2">Heading 2 and 3</th>
        </tr>
        <tr>
            <th>Heading2</th>
            <th>Heading3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Data11</td>
            <td>Data2c</td>
            <td>Data3a</td>
        </tr>
        <tr>
            <td>Data12</td>
            <td>Data2b</td>
            <td>Data3b</td>
        </tr>
        <tr>
            <td>Data13</td>
            <td>Data2a</td>
            <td>Data3c</td>
        </tr>
    </tbody>
</table>

参考 LIVE DEMO

jQuery Tablesorter - 使用colspan排序

1 个答案: