[JS]設置も簡単なテーブルのデータをソートする超軽量のスクリプト

leigeberから、既存のテーブルにも簡単に設置できる、データをソートする超軽量(1.7KB)のスクリプトを紹介します。
jQueryやPrototypeなど他のスクリプトは必要ありません。

デモのキャプチャ

JavaScript Table Sorter
demo

動作確認ブラウザは、IE 6/7/8, Fx2/3, Op, Safari, Chromeとなっています。

設置方法は簡単で、既存のものにも簡単に組み込めます。

  1. 「script.js」と「style.css」を外部ファイルとして記述します。
  2. tableに「class="sortable" id="sorter"」を記述します。
  3. テーブルの下に下記のスクリプトを記述します。

ソートを適用させたくない列には、「class="nosort"」を指定します。

追記:2009/02/10
下記のコメント欄にあるように、一部訂正があるようです。

top of page

Trackback

leave your Comments

※承認制のため、即時には反映されません。
※匿名、通りすがりさんなどへの回答は控えさせていただきます。

Comments

メシウマ状態 飯の旨いおかずがてんこ盛り

on 2008年11月8日

大前 研一「韓国はマジでやばいから日本を利用すべきw」

あとで新聞 – 2008年11月7日(金)から

404 Blog Not Found:惰訳 – Barack Obama’s acceptance speech in full
オバマ演説の和訳。朝日新聞、民主党、社民党がオバマのキーワード「Change」だけを抜き出して…

通りすがり

on 2009年2月10日

データにリンクがありエラーを吐く場合は、
script.jsファイル内

for(i=0;i<this.l;i++){
this.a[i].o=i+1; var v=this.r[i+1].cells[y].firstChild;
this.a[i].value=(v!=null)?v.nodeValue:"
}

これを

for(i=0;i<this.l;i++){
this.a[i].o=i+1;
var v=this.r[i+1].cells[y];
while(v.hasChildNodes())v=v.firstChild;
this.a[i].value=(v.nodeValue!=null)?v.nodeValue:"
}

に書き換えてください。
※配布先コメント
Martin on 21 Jan 2009 at 3:59 am
より翻訳

※記事に反映可能であればよろしくお願いします。

コリス

on 2009年2月10日

情報、ありがとうございました。

top of page

©2011 coliss