|
|
Auntion TableSort 測(cè)試交流第一版
(下一版將會(huì)存在部分表格相關(guān)特效)
-----------------------------------------------------------------------------
作者:Auntion
blog:Auntion.blogbus.com
e-mail:Auntion@Gmail.com
QQ:82874972
-----------------------------------------------------------------------------
注:
轉(zhuǎn)載請(qǐng)將此說(shuō)明全部發(fā)出,因?yàn)榭赡軙?huì)有新手不會(huì)用,并且該說(shuō)明會(huì)有更詳細(xì)的擴(kuò)展說(shuō)明.
為了國(guó)內(nèi)Javascript水平的共同進(jìn)步,讓我們一起努力！
此版為3天完成,今后可能會(huì)有升級(jí)，請(qǐng)關(guān)注我的blog.
-----------------------------------------------------------------------------
主要功能如下:
兼容ie , firefox核心.其他的我沒(méi)有測(cè)試過(guò)，我只裝這兩個(gè)瀏覽器
支持可視編輯,跟以往一樣的做table,只用設(shè)置一個(gè)id即可使用
排序:
數(shù)字:根據(jù)大小可按照降升序排列
字母:同數(shù)字
日期:同數(shù)字,格式中不要包含中文
單選、復(fù)選框:按照true或false排列
中文:按照第一個(gè)字相同的排列.
提供用戶接口定義.可以自己實(shí)現(xiàn)不同的觸發(fā)排序的方式
封裝,繼承,多態(tài).
繼承請(qǐng)使用prototype
-----------------------------------------------------------------------------
>對(duì)于新手:
如何使用?
請(qǐng)參看 使用實(shí)例_1.htm :
■ 建立一個(gè)table
■ 如需美化請(qǐng)?jiān)O(shè)置他的css樣式
■ 設(shè)置表頭，即給觸發(fā)該列排序的td一個(gè)class名字
■ 創(chuàng)建對(duì)象，即初試化tableSort這個(gè)類.
■ 使用默認(rèn)的排序觸發(fā)方式
如果初始化?
var apply = new tableSort("bodys","tag");
apply.toTagStart();//這里將使用已經(jīng)定義的一種默認(rèn)觸發(fā)方式.
■ 其中"bodys"為表格的id(可為object或string) -- 根據(jù)你的表格ID而改變
■ 其中"tag"為每列頭td的class名
>對(duì)于有興趣擴(kuò)展的朋友:
本類將提供一個(gè)可擴(kuò)展的模式,當(dāng)前僅限于觸發(fā)的方式,即用戶接口.
具體請(qǐng)參看tableSort.class.js
注:
可以通過(guò)不同的方式觸發(fā)排序-步驟:
1.創(chuàng)建對(duì)象
2.(此部根據(jù)情況可選用) 多態(tài)方式設(shè)置其中的 tempCellIndex屬性 為欲排序的列的下標(biāo)
如我要給第三行排序,tempCellIndex屬性即為3
3.獲取與設(shè)置狀態(tài)(參看tableSort.class.js中的注釋)
4.改變列頭的css樣式
5.初始化開始排序
(第一部和第二部不包含在用戶接口之內(nèi),為創(chuàng)建對(duì)象時(shí)的操作)
(其中第二部為創(chuàng)建對(duì)象之后進(jìn)行設(shè)置)
我表達(dá)能力不太好,如果不明白請(qǐng)看tableSort.class.js中
/**通過(guò)點(diǎn)擊標(biāo)簽觸發(fā)排序事件**/這一部分
打包下載
JavaScript技術(shù)：Auntion-TableSort國(guó)人寫的一個(gè)javascript表格排序的東西，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
