六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 36|回复: 0

基于JQuery组件实现table排序功能

[复制链接]

升级  84%

10

主题

10

主题

10

主题

童生

Rank: 1

积分
42
 楼主| 发表于 2013-1-29 07:45:38 | 显示全部楼层 |阅读模式
基于JQuery组件实现table排序功能
使用JQuery的好处:
1、3个JS文件都是经过压缩,总共不到50K,因此不会影响页面读取速度
2、导入jquery.js文件,可减少编写JS代码量
 
要实现table排序功能,需要包含以下3个文件
jquery-1.2.6.pack.js
jquery.tablesorter.min.js
jquery.tablesorter.pager.js 或 jquery.tablesorter.pager-1.1.js
jquery.tablesorter.min.js (仅共产品开发用)

实现对table排序,但没有分页功能
可实现功能包括:
1、只能基于table表格的排序实现;
1、可实现对table表格每个列或指定列进行排序;
2、可强制指定列排序;
3、可对table列自定义CSS样式;
4、DEBUG断点调试;
5、可实现多列复合排序;
 
优点:
1、可一次性读取所有记录,由JS实现分页,不再需要由分页类实现分页功能
2、不需要后台硬编码实现排序,直接由JS实现,无需重新编码
3、减轻服务器承受的压力
4、对table排序的绑定和卸载方便
 
缺点:
1、需学习JQuery编码模式和jquery.tablesorter组件
2、当数据量大时,如1000条以上记录,可能会出现页面加载后,有1-2秒页面停顿效果。
3、数据的实时性差
 
jquery.tablesorter.pager.js
可对jquery.tablesorter组件实现分页功能效果
 
实现功能:
1、在jquery.tablesorter.min.js基础上实现分页
2、支持上一页、下一页、首页、末页、页数和总页数同时显示、每页显示数据
 
改进的jquery.tablesorter.pager-1.1.js
增加功能:
1、支持单独显示页数,如:“第1页”
2、支持单独显示总页数,如:“共5页”
3、增加输入页码数进行页数转向
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表