用Javascript进行简单的Table点击排序

闲着没事,随便写了个简单的Table排序的js,大家有兴趣的看看,有需要的就拿去吧.废话不说了,大家看代码吧,最下面是效果,着急的就直接往下拉好了.新发现一个bug:10比2小,原因是sort默认是按ascii排序的,已修复该问题.
旧版DEMO下载
最新DEMO下载 [修复了一些已知的问题,结合网友的回复优化了一些代码,用法跟原来要样]
html代码[可以不看,跟html没什么关系.]: 
 
javascript代码:

代码:new TableSorter("tb1");
效果:点击任意表头可执行排序.
序号 姓名 工号 职位 性别 业绩 报到时间
4 张学友 8009 副总裁 男 90 2008-04-11
1 刘德华 8008 总裁 男 98 2008-04-12
8 张曼玉 8007 高级经理 女 82 2008-04-16
9 周润发 8006 副总裁 男 88 2008-04-13
5 张柏芝 8005 助理 女 78 2008-04-13
2 吴奇隆 8004 主管 男 80 2008-04-16
3 王光良 8003 经理 男 85 2008-04-15
7 陈慧琳 8002 试用期 女 85 2008-04-18
6 陈冠希 8001 总监 男 60 2008-04-18

代码:new TableSorter("tb2", 0, 2, 5, 6);
效果:点击表头0,2,5,6列可执行排序.
序号 姓名 工号 职位 性别 业绩 报到时间
1 刘德华 8008 总裁 男 98 2008-04-12
2 吴奇隆 8004 主管 男 80 2008-04-16
3 王光良 8003 经理 男 85 2008-04-15
4 张学友 8009 副总裁 男 90 2008-04-11
5 张柏芝 8005 助理 女 78 2008-04-13
6 陈冠希 8001 总监 男 60 2008-04-18
7 陈慧琳 8002 试用期 女 85 2008-04-18
8 张曼玉 8007 高级经理 女 82 2008-04-16
9 周润发 8006 副总裁 男 88 2008-04-13


代码:new TableSorter("tb3").OnSorted = function(c, t)
{
alert("table is sorted by " + c.innerHTML + " " + (t ? "Asc" : "Desc"));
}
效果:点击任意表头可执行排序并返回提示.
序号 姓名 工号 职位 性别 业绩 报到时间
1 刘德华 8008 总裁 男 98 2008-04-12
2 吴奇隆 8004 主管 男 80 2008-04-16
3 王光良 8003 经理 男 85 2008-04-15
4 张学友 8009 副总裁 男 90 2008-04-11
5 张柏芝 8005 助理 女 78 2008-04-13
6 陈冠希 8001 总监 男 60 2008-04-18
7 陈慧琳 8002 试用期 女 85 2008-04-18
8 张曼玉 8007 高级经理 女 82 2008-04-16
9 周润发 8006 副总裁 男 88 2008-04-13

http://www.cnblogs.com/robot/archive/2008/04/20/1161801.html
posted @ 2008-05-07 19:15  Ewin  阅读(562)  评论(0)  编辑  收藏  举报