1

次のようなコードがあるとします。

<table>
    <tr>
        <th>name</td>
        <th>price</td>
    </tr>
    <tr>
        <td>a</td>
        <td class="sort">5</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">3</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">8</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">2</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">6</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">20</td>
    </tr>
</table>

ただし、次のように配置する必要があります。

<table>
    <tr>
        <th>name</td>
        <th>price</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">2</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">3</td>
    </tr>
    <tr>
        <td>a</td>
        <td class="sort">5</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">6</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">8</td>
    </tr>
    <tr>
        <td>b</td>
        <td class="sort">20</td>
    </tr>
</table>

テーブルデータに基づいてテーブルデータを配置します。注：クラスが定義されますclass="sort"

前もって感謝します

アップデート：

ユーザーのクリックなしでテーブルを配置したい。

4

3 に答える 3

1

コードが不足しているために何も試しておらず、ページ/テーブルをどのように生成しているかを教えていないようです（質問は私たちに助けではなくあなたのために仕事をするように頼んでいるようです）これを見てください：http：//datatables.net/それはあなたが望む解決策を与えるかもしれません。

于 2012-06-16T15:39:26.103 に答える
1

を使用して行を配列に変換することにより、配列で$.makeArraynatvejavascriptを使用できますsort()。該当するようだったので数値で並べ替えました

デモ：http：//jsfiddle.net/3MBPF/

function sortNum(a, b) {
   return 1 * $(a).find('.sort').text() < 1 * $(b).find('.sort').text() ? 0 : 1;
}

$(function() {
    var elems = $.makeArray($('tr:has(.sort)').remove())
    elems.sort(sortNum)
    $('table').append($(elems));
});
于 2012-06-16T16:40:55.653 に答える
0

http://tinysort.sjeiti.com/で入手可能なjQueryTinysortプラグインを使用できます。それはあなたのソートのニーズのほとんどをカバーするはずです。

于 2012-06-16T15:40:54.103 に答える