0

私は何かばかげた間違ったことをしているに違いありませんが、私はそれを見ていません。私のサイトでは、JQuery TableSorter をテーブルにアタッチし、ソートを実行したいと考えていますが、クリックしても効果がありません。ソートは行われません。静的テーブルとして残ります。

これは、私が抱えている問題の簡略化された JSFiddle です。

http://jsfiddle.net/96AEE/3/

次のように、JavaScript を使用した非常に単純なテーブルです。

<table cellspacing="0" cellpadding="0" class="tablesorter" id="gift_certificates">
    <thead>
        <tr class="nav">
            <td>
                <input type="checkbox" onclick="checkAll();" class="short" value="1" id="check_all" name="check_all" />
            </td>
            <td>Gift Cert</td>
            <td>Note</td>
            <td>Order #</td>
            <td>Order Date</td>
            <td>Amount</td>
            <td>Redeemed</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td valign="top"></td>
            <td>ss1q</td>
            <td>-</td>
            <td>-</td>
            <td>$300.00</td>
            <td>    <a href="test.php">Sale</a>

            </td>
            <td>true</td>
        </tr>
        <tr>
            <td valign="top">
                <input type="checkbox" value="103" onclick="document.getElementById('check_all').checked = false;" class="short" id="check_103" name="check_103" />
            </td>
            <td>443ss</td>
            <td>(1d10t) Arizona Tea</td>
            <td>-</td>
            <td>-</td>
            <td>$50.00</td>
            <td>-</td>
        </tr>
        <tr>
            <td valign="top">
                <input type="checkbox" value="50" onclick="document.getElementById('check_all').checked = false;" class="short" id="check_50" name="check_50" />
            </td>
            <td>199e</td>
            <td>(#9000) Over</td>
            <td>-</td>
            <td>-</td>
            <td>$300.00</td>
            <td>-</td>
        </tr>
        <tr>
            <td valign="top">
                <input type="checkbox" value="87" onclick="document.getElementById('check_all').checked = false;" class="short" id="check_87" name="check_87" />
            </td>
            <td>F990</td>
            <td>($09aa) Trouble</td>
            <td>-</td>
            <td>-</td>
            <td>$300.00</td>
            <td>-</td>
        </tr>
    </tbody>
</table>

JavaScript:

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

私が見逃している明らかなものはありますか？

4

3 に答える 3

2

これは、HTML テーブルのマークアップによるものです。

thead 要素内では、td の代わりに th タグを使用する必要があります。

<thead>
    <tr>
        <th></th>
        ...
    </tr>
</thead>

ワーキングJSfiddle：

http://jsfiddle.net/bybFK/

于 2013-10-10T17:03:18.443 に答える