Juery解决tablesorter中文排序和字符范围的方法


Posted in Javascript onMay 06, 2015

本文实例讲述了Juery解决tablesorter中文排序和字符范围的方法。分享给大家供大家参考。具体分析如下:

tablesorter是jQuery插件中比较优秀的一款表格排序插件,我相信大家都使用过或有所耳闻,我在这里就不过多介绍了,详细信息可以看看官方网站:http://tablesorter.com/docs/(其中的demo做得比较完整)。

在使用了tablesorter开发的几个项目中,发现了两种类型的排序存在问题,如下:

第一个问题是无法对中文字符进行排序,这是因为在对字符排序时,是使用的unicode值进行的字符大小比较,代码如下:

Js代码

function sortText(a,b) {
  return ((a < b) ? -1 : ((a > b) ? 1 : 0));
};
function sortTextDesc(a,b) {
  return ((b < a) ? -1 : ((b > a) ? 1 : 0));
};
function sortText(a,b) {
  return ((a < b) ? -1 : ((a > b) ? 1 : 0));
};
function sortTextDesc(a,b) {
  return ((b < a) ? -1 : ((b > a) ? 1 : 0));
};

而我们想要得到的结果是按汉字拼音进行顺序进行排序,因此我们将代码修改为以下代码即可:

Js代码

function sortText(a,b) {
  return a.localeCompare(b);
};
function sortTextDesc(a,b) {
  return b.localeCompare(a);
};
function sortText(a,b) {
  return a.localeCompare(b);
};
function sortTextDesc(a,b) {
  return b.localeCompare(a);
};

localeCompare方法是JS自带的方法,不用多说,望文生义就知道这个方法是根据当前区域下对字符的大小进行比较,不过这个方法无法处理多音字。

第二个问题是无法对超出了范围的数值型数据进行排序,这是因为在进行数值类型转换时,存在数据值失真的情况,例如:

Js代码

alert(parseFloat('9999999999999999'));  // 10000000000000000
alert(parseFloat('10000000000000001')); // 10000000000000000
alert(parseFloat('10000000000000004')); // 10000000000000004
alert(parseFloat('10000000000000005')); // 10000000000000004
alert(parseFloat('10000000000000006')); // 10000000000000006
alert(parseFloat('9999999999999999'));  // 10000000000000000
alert(parseFloat('10000000000000001')); // 10000000000000000
alert(parseFloat('10000000000000004')); // 10000000000000004
alert(parseFloat('10000000000000005')); // 10000000000000004
alert(parseFloat('10000000000000006')); // 10000000000000006

这样的偏差会使得排序结果不准确,为了避免这种问题,应该不使用原始值进行比较,而是应该引入权值,数值从左到右,每一位数值对应的权值递减,然后根据权值和原始值计算出的新值用于比较,这就只需要修改formatFloat方法就能解决这个问题了。

Js代码

this.formatFloat = function(s) {    
  // TODO    
  var i = parseFloat(s);    
  return (isNaN(i)) ? 0 : i;    
};

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript之对系统的toFixed()方法的修正
May 08 Javascript
javascript脚本编程解决考试分数统计问题
Oct 18 Javascript
jQuery中index()的用法分析
Sep 05 Javascript
分享一个常用的javascript静态类
Dec 31 Javascript
JavaScript提高网站性能优化的建议(二)
Jul 24 Javascript
微信js-sdk分享功能接口常用逻辑封装示例
Oct 13 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
CodeMirror js代码加亮使用总结
Mar 25 Javascript
JS Testing Properties 判断属性是否在对象里的方法
Oct 01 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
Aug 03 Javascript
如何利用JavaScript编写更好的条件语句详解
Aug 10 Javascript
详解React的回调渲染模式
Sep 10 Javascript
javascript操作表格排序实例分析
May 06 #Javascript
js获取form的方法
May 06 #Javascript
js给selected添加options的方法
May 06 #Javascript
js表格排序实例分析(支持int,float,date,string四种数据类型)
May 06 #Javascript
js实现漂浮回顶部按钮实例
May 06 #Javascript
js实现仿百度汽车频道选择汽车图片展示实例
May 06 #Javascript
js中日期的加减法
May 06 #Javascript
You might like
论建造顺序的重要性
2020/03/04 星际争霸
用文本文件制作留言板提示(上)
2006/10/09 PHP
PHP迅雷、快车、旋风下载专用链转换代码
2010/06/15 PHP
codeigniter框架批量插入数据
2014/01/09 PHP
PHP基于数组实现的分页函数实例
2014/08/20 PHP
PHP中is_file()函数使用指南
2015/05/08 PHP
jquery命令汇总,方便使用jquery的朋友
2012/06/26 Javascript
js导航栏单击事件背景变换示例代码
2014/01/13 Javascript
JS拖拽组件学习使用
2016/01/19 Javascript
Javascript获取统一管理的提示语(message)
2016/02/03 Javascript
js获取页面及个元素高度、宽度的代码
2016/04/26 Javascript
一个仿微博登陆邮箱提示框js开发案例
2016/07/28 Javascript
javascript数字验证的实例代码(推荐)
2016/08/20 Javascript
微信小程序 wx:key详细介绍
2016/10/28 Javascript
js实现鼠标拖动功能
2017/03/20 Javascript
详解angularjs的数组传参方式的简单实现
2017/07/28 Javascript
关于HTTP传输中gzip压缩的秘密探索分析
2018/01/12 Javascript
vue中使用iview自定义验证关键词输入框问题及解决方法
2018/03/26 Javascript
JavaScript学习笔记之图片库案例分析
2019/01/08 Javascript
Vue项目页面跳转时浏览器窗口上方显示进度条功能
2020/03/26 Javascript
Python中的进程分支fork和exec详解
2015/04/11 Python
Python多线程经典问题之乘客做公交车算法实例
2017/03/22 Python
Python 利用pydub库操作音频文件的方法
2019/01/09 Python
python找出一个列表中相同元素的多个索引实例
2019/06/11 Python
python滑块验证码的破解实现
2019/11/10 Python
django框架基于queryset和双下划线的跨表查询操作详解
2019/12/11 Python
Python unittest生成测试报告过程解析
2020/09/08 Python
Django xadmin安装及使用详解
2020/10/26 Python
CSS3 Flex 弹性布局实例代码详解
2018/11/01 HTML / CSS
工程现场管理求职自荐信
2013/10/02 职场文书
大四自我鉴定范文
2013/10/06 职场文书
施工班组长岗位职责
2014/01/05 职场文书
我的中国梦演讲稿800字
2014/08/19 职场文书
领导班子个人对照检查剖析材料
2014/09/29 职场文书
幼儿园见习报告范文
2014/10/30 职场文书
干部考核工作总结2015
2015/07/24 职场文书