1

私はそのようなhtmlテーブル構造を持っています:

<table cellpadding="0" cellspasing="0" class="tablesorter zebra" id="articles-table">

    <tbody>...etc standart stuff...
    <tr>
    <td>
    </td>
    </tr>
    then i have 
    <tr id="123123">
    <td colspan="7">
     Analogs
    </td>
    </tr>
    <tr id="prcol">
    <td>
    <td>
</td>
</td>
<tr>
...
</table>

私はそのようなスクリプトを試しました:

jQuery(function($) {
var table = $('table');
$(document).ready(function () {    
    $('#prcol')
    .each(function(){        
        var th = $(this),
            thIndex = th.index(),
            inverse = false;        
        th.click(function(){            
            table.find('td').filter(function(){                
                return $(this).index() === thIndex;                
            }).sortElements(function(a, b){                
                return $.text([a]) > $.text([b]) ?
                    inverse ? -1 : 1
                    : inverse ? 1 : -1;                
            }, function(){
                return this.parentNode; 
            });
            inverse = !inverse;                
        });            
    });
  });
});

しかし、主な問題は、すべてを並べ替えていることですid 123123...

2番目のdivのみにあるフロート番号でソートする必要があります! ID = 123のtrでは、これは重要です...また、Webで見られるすべてのソリューションは巨大です...特定のIDを持ついくつかのtrで単純なソート2番目のtdが必要です...どうすれば解決できますか?

tablesorter.com を試してみました。しかし、それは私のものではありません...一部のTRだけにカスタマイズすることはできません...また、ドキュメントがロードされた場合はソーターにする必要があります。

ここでも＃2を試してください： リンク

1列目はまだ悩み中…

4

1 に答える 1

0

あなたが英語から何を望んでいたかを正確に伝えるのは難しいですが、私が思いついたのは次のとおりです。

  1. すべてのテーブルを検索します。
  2. 各テーブルについて：
    1. クラスでマークされたヘッダーセルを見つけますprcol。これが、並べ替える列です。
    2. クラスtbodyでマークされたテーブル内のすべてのタグを検索します。sortable
    3. ソート可能なボディごとに：
      1. 並べ替え可能なセルのfloat値に従って行を並べ替えます
      2. 古い行をソートされた行に置き換えます

これを機能させるために、jQueryのドキュメント準備完了イベントに次のものを入れました。

$("thead .prcol").each(function(thIdx, sortElem) {
    // find our column index
    var index = $.inArray(sortElem, $(sortElem).closest('tr').children());
    var colSelector = "td:eq(_n_)".replace('_n_', index);

    $(sortElem).closest('table').children('tbody.sortable').each(function(tbIdx) {
        var rows = $(this).children('tr');
        rows.sort(function(left, right) {
            var leftText = $(colSelector, left).text();
            var rightText = $(colSelector, right).text();
            var leftValue = parseFloat(leftText) || 10000;
            var rightValue = parseFloat(rightText) || 10000;
            return  leftValue - rightValue;
        });
        $(this).html(rows);
    });
});​

動作中のコードを示すフィドルを作成しました。何が起こっているのかがわかりやすいようにテーブルを大幅に簡略化し、3番目のテーブル本体を並べ替えないようにしました。

于 2012-11-14T23:42:51.120 に答える