javascript 表格排序和表头浮动效果(扩展SortTable)_javascript技巧

WBOY
Release: 2016-05-16 18:54:32
Original
1278 people have browsed it

一、SortTable说明
SortTable
version 2
7th April 2007
Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/

Instructions:
Download this file
Addto your HTML
Add class=”sortable” to any table you'd like to make sortable
Click on the headers to sort

Thanks to many, many people for contributions and suggestions.
Licenced as X11: http://www.kryogenix.org/code/browser/licence.html
This basically means: do what you want with it.

用法:将要排序的表格添加CSS,如














默认对所有列都会添加排序功能,对于不需要排序的列可添加CSS:”sorttable_nosort”,如 二、更新说明Update:version 2.19th Mar 2009Hopesoft , http://www.51ajax.com/blog/说明:1.增加中文排序2.增加指定各行使用不同css样式功能(比如奇偶行背景色不一致)用法:在要表头浮动的表格上添加属性,如


3.增加表头浮动功能(支持同一个页面有多个表格,比如不同Tab标签下的各个表格)用法:在要表头浮动的表格上添加CSS,如







另外最好指定“表头”和“数据行”的各列的列宽,如 以避免在FireFox下表头浮动时表头各列与数据各列不对齐4.增加页面载入后自动排序用法:在表格上添加属性autosortcol,对应要自动排序的列号,注意是从0开始如
姓名 年龄
张三 21



http://img.jb51.net/online/sorttable/sorttable.htm
http://img.jb51.net/online/sorttable/sorttable.rar ,则表示当页面载入成功后,会自动对第4行进行新增的代码都用中文做了注释,屏蔽了原有代码中部分代码。另外原来代码中升降序顺序ms是反的,我这边做了更改。演示地址打包下载地址:
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!