tablesorter.js表格排序使用方法(支持中文排序)
你需要从官方网站上下载tablesorter.js插件。初始版本的插件并不支持中文排序。为了解决这个问题,我们需要对源码进行相应的修改。
修改后的代码如下:
```javascript
function sortText(a, b) {
return a.localeCompare(b);
};
function sortTextDesc(a, b) {
return b.localeCompare(a);
};
```
通过使用JavaScript的localeCompare方法,我们可以轻松实现中文的排序。这个方法会根据本地语言环境的字符串排序规则进行比较,对于包含中文的字符串,它能够给出正确的排序结果。
一、如果第五列和第六列不需要排序,你可以这样写代码:
```javascript
$("mytable").tablesorter({
headers: {
4: {sorter: false}, // 第五列不参与排序
5: {sorter: false} // 第六列不参与排序
}
});
```
为了保持界面整洁,你可能需要移除这两列的样式,确保它们不会显示默认的排序图标。具体做法依赖于你的样式表设计。
二、如果你希望第五列采用自定义的排序方式,而第六列则不需要排序,你可以按照以下步骤操作:
你需要定义一个自定义的排序器。这个器能够将特定的中文状态(如“已作废”,“待审核”,“已审核”,“已生效”)转换为数字,以便进行数值排序。代码如下:
```javascript
$.tablesorter.addParser({
id: "grade", // 唯一ID
is: function(s) {
// 这里定义哪些内容应该使用这个器,此处为所有内容都使用
return false;
},
format: function(s) {
// 将中文状态转换为数字
return s.toLowerCase().replace(/已作废/, 1).replace(/待审核/, 2).replace(/已审核/, 3).replace(/已生效/, 4);
},
type: "numeric" // 设定为数值排序
});
```
```javascript
$("mytable").tablesorter({
headers: {
4: {sorter: "grade"}, // 第五列使用自定义的"grade"排序方式
5: {sorter: false} // 第六列不参与排序
}
});
```
这样,你的第五列就能按照你定义的规则进行排序了。至于更多例子和细节,你可以前往官方站点进行深入学习。希望这些分享能对大家的学习有所帮助,也希望大家多多支持狼蚁SEO。如果你还有其他问题或需求,欢迎与我们交流。让我们一起学习进步! c Cambrian渲染完成结束。
编程语言
- tablesorter.js表格排序使用方法(支持中文排序)
- jQuery简单tab切换效果实现方法
- 定期自动运行ASP程式的代码
- 详解webpack import()动态加载模块踩坑
- 深入理解Ajax的get和post请求
- 通过表单的做为二进制文件上传request.totalbytes提
- 正则表达式链接替换函数的技巧
- php 解决substr()截取中文字符乱码问题
- Vue-cli Eslint在vscode里代码自动格式化的方法
- AngularJS中ng-class用法实例分析
- 通过BootStrap-select插件 js jQuery控制select属性变化
- JS实现复制功能
- JS锚点的设置与使用方法
- 详解PHP中的null合并运算符
- Vue下的国际化处理方法
- 详解vue + vuex + directives实现权限按钮的思路