javascriptでソート出来る表を作る「Table Sorter」

テーブルで作った表を降順・昇順で並べ替えたい時には、Neil Fraserで公開されているTable Sorterでソートが簡単にできます。
注意:日本語ではソートできない模様です。
点数などの数値や、名前などをアルファベット表記にした項目を追加するなど工夫してください。
tablesort

使用方法
まずtablesort.jsをhead内に挿入します。
次に、テーブルで作った表の項目部分を<thead></thead>で囲みます。
また、各項目にはlabelとしてcase、nocase、numのいずれかを書き込む必要があります。
メインの表は<tbody></tbody>内に書き込みます。

また表示される矢印と空白(↑'、 '↓'、' ')はオリジナル画像が使えます。
arrow-up.gif、arrow-down.gif、blank.gifの画像を作って以下のscriptを埋め込んでください。
<script type="text/javascript"><!--
TableSort.arrowNone = " <img height=10 width=10 src='blank.gif' alt=''>";
TableSort.arrowUp = " <img height=10 width=10 src='arrow-up.gif' alt='↑'>";
TableSort.arrowDown = " <img height=10 width=10 src='arrow-down.gif' alt='↓'>";
//--></script>

詳しくはjavascriptでソートが出来る表を作る紹介ページをご覧下さい。

sponsors

「javascriptでソート出来る表を作る「Table Sorter」」をシェアする

記事作成:
記事URL:

TOP > > > javascriptでソート出来る表を作る「Table Sorter」

前の記事:
次の記事:WYSIWYGを可能にするjavascript「openWYSIWYG」