js实现漂亮表格+分页排序功能
js实现漂亮表格+分页排序功能
lgscofield 发表于2年前
js实现漂亮表格+分页排序功能
  • 发表于 2年前
  • 阅读 18
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

TinyTable JavaScript Table Sorter

This updated table sorter script is easy to use and feature packed at only 2.5KB. New features include column highlighting, optional pagination, support for links, and date/link parsing. A few other features are alternate row highlighting, header class toggling, auto data type recognition and selective column sorting. More updates will follow soon.

To initialize a table sorter follow the pattern below:

1
2
3
4
5
6
7
8
9
10
11
12
13
var sorter = new TINY.table.sorter( 'sorter' );
sorter.head = 'head' ; //header class name
sorter.asc = 'asc' ; //ascending header class name
sorter.desc = 'desc' ; //descending header class name
sorter.even = 'evenrow' ; //even row class name
sorter.odd = 'oddrow' ; //odd row class name
sorter.evensel = 'evenselected' ; //selected column even class
sorter.oddsel = 'oddselected' ; //selected column odd class
sorter.paginate = true ( false ); //toggle for pagination logic
sorter.pagesize = 15 (20); //toggle for pagination logic
sorter.currentid = 'currentpage' ; //current page id
sorter.limitid = 'pagelimit' ; //page limit id
sorter.init( 'table' ,1);

Before initialization, a new table sorter object must be created. The parameter taken by TINY.table.sorter is the variable name used for the object. The object.init function takes 2 parameters: the id of the table and the initially sorted column index (optional). If you want to exclude a column from sorting add class=”nosort” to the appropriate table header. Table styling is completely customizable via the CSS.

This script has been tested in all major browsers and is available free of charge for both personal or commercial projects under the creative commons license. Community support is available here. Paid support is also available, contact me for details.

标签: sorter javascript
共有 人打赏支持
lgscofield
粉丝 20
博文 105
码字总数 62676
×
lgscofield
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: