转自：http://www.cnblogs.com/robot/archive/2008/04/20/1161801.html
新发现一个bug:10比2小,原因是sort默认是按ascii排序的,已修复该问题.
最新DEMO下载 [修复了一些已知的问题,结合网友的回复优化了一些代码,用法跟原来要样]
html代码[可以不看,跟html没什么关系.]:
javascript代码:
最新DEMO下载 [修复了一些已知的问题,结合网友的回复优化了一些代码,用法跟原来要样]
html代码[可以不看,跟html没什么关系.]:
javascript代码:
代码:new TableSorter("tb1");
效果:点击任意表头可执行排序.
| 序号 | 姓名 | 工号 | 职位 | 性别 | 业绩 | 报到时间 |
|---|---|---|---|---|---|---|
| 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("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 |