table排序 jquery.tablesorter.js

一.Demo下载地址:

1.tablesorter.js下载地址:

http://download.csdn.net/detail/zhang1096646030/8890489

2.flexigrid.js下载地址:

二.修改:

1.支持中文排序,要做如下操作:

jquery.tablesorter.js中修改如下注释的两个函数:

//中文排序asc
function sortText(a,b) {
return a.localeCompare(b);
};
//中文排序desc
function sortTextDesc(a,b) {
return b.localeCompare(a);
};
/*
中文不能正确排序--废除
function sortText(a,b) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
}; function sortTextDesc(a,b) {
return ((b < a) ? -1 : ((b > a) ? 1 : 0));
};
*/

2.ip排序不正确:(当你的排序不正确时,再修改,负责就不用改!)

ts.addParser({
id: "ipAddress",
is: function(s) {
return /^\d{2,3}[\.]\d{2,3}[\.]\d{2,3}[\.]\d{2,3}$/.test(s);
},
format: function(s) { var a = s.split("."), r = "", l = a.length;
for(var i = 0; i < l; i++) {
var item = a[i];
if(item.length == 1) {
r += "00" + item;
}else if(item.length == 2) {
r += "0" + item;
} else {
r += item;
}
}
return $.tablesorter.formatInt(r);
},
type: "numeric"
}); /*
ip不能正常排序--废除
ts.addParser({
id: "ipAddress",
is: function(s) {
return /^\d{2,3}[\.]\d{2,3}[\.]\d{2,3}[\.]\d{2,3}$/.test(s);
},
format: function(s) { var a = s.split("."), r = "", l = a.length;
for(var i = 0; i < l; i++) {
var item = a[i];
if(item.length == 2) {
r += "0" + item;
} else {
r += item;
}
}
return $.tablesorter.formatFloat(r);
},
type: "numeric"
});
*/

3.工作需要(状态、事件数及告警数)

/*
*工作需要扩展的,仅自己用!
*扩展排序函数
*/
//status排序
$.tablesorter.addParser({
id: "status", //指定一个唯一的ID
is: function(s){
return false;
},
format: function(s){
var str=0;
if(s.indexOf('<')!=-1){
str=0;
}else{
str=s.toLowerCase().replace(/在线/,1).replace(/离线/,2); //将中文换成数字
}
return str;
},
type: "numeric" //按数值排序
}); //num排序
$.tablesorter.addParser({
id: "num", //指定一个唯一的ID
is: function(s){
return false;
},
format: function(s){
var point=s.indexOf("</span>");
var str=s[point-1];
if(str.indexOf('>')!=-1){
str=-1;
}
return str;
},
type: "numeric" //按数值排序
});

三.调用:

flexme:表格id

0、1、2等:列的索引

ipAddress、status等:是以什么类型排序,比如:时间、金钱、中文,等。

调用只需这么一句:

静态放到:页面加载完函数中;

动态放到:动态返回数据完后,保证表格已经有了数据。(此时,也可以理解成静态了)

sorter:false  是指指定的列不排序

$("#flexme").tablesorter({headers:{0:{sorter:"ipAddress"},2:{sorter:"status"},3:{sorter:"num"},4:{sorter:"num"}}});

javascript table排序之jquery.tablesorter.js的更多相关文章

  1. jquery.tablesorter.js 学习笔记

    jquery.tablesorter.js 一般情况下,表格数据的排序方式有两种,第一种是让后端服务将排序后的数据直接输出,另外一种方式就是使用客户端排序,而jquery.tablesorter.js ...

  2. js实现table排序(jQuery下的jquery.sortElements)

    项目中要实现table排序的功能. 网上有非常多解决方式,非常多都基于jQuery. jquery.tablesorter.大小17KB.只是他的首页在ie10下兼容性有点问题. DataTables ...

  3. jQuery html表格排序插件:tablesorter

    ablesort是一款很好用的jQuery表格排序插件. 支持多种数据类型排序,会自动识别表格内容数据类型,使用也非常方便. 使用jQuery tablesort实现html表格方法: 1. 下载jQ ...

  4. javascript:jQuery tablesorter 2.0

    https://mottie.github.io/tablesorter/docs/index.html 1.GridView <%@ Page Language="C#" ...

  5. Table排序

    <html> <head> <title>tablesorter表单排序插件</title> <link type ="text/css ...

  6. 使用jquery.validate.js插件进行表单里控件的验证

    jsp中具体实现的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  7. 图片上传(方法一:jquery.upload.js)

    一.在JSP页面引入jquery.upload.js 文件: <script type="text/javascript" src="${ctx}/script/j ...

  8. 【转】jquery.cookie.js的使用

    Cookie是由服务器端生成,发送给User-Agent(一般是浏览器),浏览器会将Cookie的key/value保存到某个目录下的文本文件内,下次请求同一网站时就发送该Cookie给服务器(前提是 ...

  9. jquery.jqzoom.js图片放大镜

    jqzoom插件实现图片放大镜效果 1. jquery.jqzoom.js //************************************************************ ...

随机推荐

  1. VMware tools的使用

    现在的开发环境基本上都是lnmp,所以我们需要在windows下使用虚拟机来搭建开发环境, 但是 在本地写好代码以后,需要上传到虚拟机的运行目录,每次修改都需要上传??? 不存在的!!! 使用Vmwa ...

  2. Python:函数变量的使用

    1.上层函数不能直接使用其嵌套函数的变量: def func1(x, y): z = x + y def func2(): m = 3 z += m return z print(func1(1, 2 ...

  3. [转]RabbitMQ三种Exchange模式(fanout,direct,topic)的性能比较

    RabbitMQ中,所有生产者提交的消息都由Exchange来接受,然后Exchange按照特定的策略转发到Queue进行存储 RabbitMQ提供了四种Exchange:fanout,direct, ...

  4. 10-13C#语句(1)

    C#语句:判断.循环.形成程序的分支和循环 1.语句分类 1)顺序语句 2)分支语句 3)循环语句 2.语句 选择控制:if,else,switch,case 循环控制:while,do,for,fo ...

  5. Hadoop YARN: 1/1 local-dirs are bad: /var/lib/hadoop-yarn/cache/yarn/nm-local-dir; 1/1 log-dirs are bad: /var/log/hadoop-yarn/containers hdfs硬盘90% yarn unhealthy

    1/1 local-dirs are bad: /var/lib/hadoop-yarn/cache/yarn/nm-local-dir; 1/1 log-dirs are bad: /var/log ...

  6. ava的打包jar、war、ear包的作用、区别、打包方式

    编为大家介绍,基于Java的打包jar.war.ear包的作用与区别详解.需要的朋友参考下以最终客户的角度来看,JAR文件就是一种封装,他们不需要知道jar文件中有多少个.class文件,每个文件中的 ...

  7. matlab基础功能实践

    一.matlab在高等数学中的应用(<数学建模算法与应用>P453) 1.求极限 syms x b=limit((sqrt(1+x^2)-1)/(1-cos(x))) syms x a b ...

  8. bzoj1951 组合数取模 中国剩余定理

    #include<bits/stdc++.h> using namespace std; typedef long long ll; const int a[4]={2,3,4679,35 ...

  9. Ros学习——launch文件解析

    launch文件的重点是:节点(node)元素的集合. roslaunch 则是让所有的节点共享同一个终端. 1.标签(元素)说明 1. group标签 2. node标签 <group ns= ...

  10. Sequelize框架:

    1.安装mysql支持: npm install mysql --save-dev 2.安装sequelize npm install sequelize --save-dev 3.创建ORM对象 v ...