ホームページ > ウェブフロントエンド > jsチュートリアル > jsヘッダソート実装方法_javascriptスキル

jsヘッダソート実装方法_javascriptスキル

WBOY
リリース: 2016-05-16 16:19:56
オリジナル
1230 人が閲覧しました

この記事の例では、jsヘッダーのソートの実装方法を説明します。皆さんの参考に共有してください。

具体的な実装方法は以下のとおりです。

コードをコピー コードは次のとおりです:

<スクリプトタイプ="text/javascript">
//降順にソートするかどうか
var isDescending = true;
/*****************************************
* * 並べ替える行は タグ内に配置する必要があります
* tableId: ソートテーブルID
*colNo: ソートされた列番号、つまり、0 から始まる列
* startRowNo: 0 から始まるソートの開始行番号
* sortLength: ソートする行数、
* type: ソート列のタイプ
​*/
関数 sort(tableId,colNo,startRowNo,sortLength,type)
{
//ソート対象の行数が 1 または 0 の場合、ソート操作は実行されません
If(sortLength return;
}
var currTable = document.getElementById(tableId);
var theHeader = currTable.outerHTML.substring(0, currTable.outerHTML.indexOf('') 7)
var theFooter = currTable.outerHTML.substring(currTable.outerHTML.indexOf('')-8);
//ここでの行数はヘッダ行とテーブル行を除いた行数です
var theRows = new Array(sortLength);
//テーブル内のデータをループします
for(i=startRowNo; i {
theRows[i-startRowNo] = new Array(currTable.rows[i].cells[colNo].innerText.toLowerCase(), currTable.rows[i].outerHTML);
}
If(type.toUpperCase()=='NUMBER')
{
theRows.sort(compareNumber);
}
else if(type.toUpperCase()=='DATE')
theRows.sort(compareDate);
else if(type.toUpperCase()=='STRING')
theRows.sort(compareString);
var tableInfo=''
for(j=0; j {
tableInfo =theRows[j][1];
}
isDescending = !isDescending;
currTable.outerHTML= theHeader tableInfo theFooter;
戻る ;
}
//数値を比較
関数compareNumber(x, y)
{
//データを通貨形式に変換します
a = x[0].excludeChars(",").trim();
b = y[0].excludeChars(",").trim();

If(a==""){a=0;}
If(b==""){b=0;}
if(isDescending)
{
return parseFloat(b) - parseFloat(a);
}
その他
{
return parseFloat(a) - parseFloat(b);
}
}
//文字列を比較
関数compareString(x, y)
{
            if(isDescending)
            {
                if(x[0]>y[0]) return -1;
                else if(x[0]                 それ以外の場合は 0 を返します;
            }
            それ以外
            {
                if(x[0]                 else if(x[0]>y[0]) return 1;
                それ以外の場合は 0 を返します;
            }
    }
    //对時間経過比较
    関数compareDate(x,y){
        var arr=x[0].split("-");
        var starttime=new Date(arr[0],arr[1],arr[2]);
        var starttimes=starttime.getTime();
        var arrs=y[0].split("-");
        var lktime=new Date(arrs[0],arrs[1],arrs[2]);
        var lktimes=lktime.getTime();
        
        if(isDescending)
        {
            return lktimes - starttimes;
        }
        それ以外
        {
            starttimes を返す - lktimes;
        }
    }
    //削除文字列のうち指定されたすべての文字列
    String.prototype.excludeChars = function(chars){
         varmatching = new RegExp(chars , "g") ;
         return this.replace(matching , '') ;
    }

ここで説明されている大家向けの JavaScript プログラムの設計が役立つことを望みます。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート