jQuery排序插件tableSorter使用方法


Posted in Javascript onFebruary 10, 2017

本文实例为大家分享了jQuery排序插件tableSorter的使用方法,供大家参考,具体内容如下

1.先引两个js

<script type="text/javascript" src="../js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.tablesorter.min.js"></script>

注意:表格要用thead/th和tbody。如:

<table id="myTable"> 
<thead> 
<tr> 
  <th>Last Name</th> 
  <th>First Name</th> 
  <th>Email</th> 
  <th>Due</th> 
  <th>Web Site</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
  <td>Smith</td> 
  <td>John</td> 
  <td>jsmith@gmail.com</td> 
  <td>$50.00</td> 
  <td>http://www.jsmith.com</td> 
</tr> 
<tr> 
  <td>Bach</td> 
  <td>Frank</td> 
  <td>fbach@yahoo.com</td> 
  <td>$50.00</td> 
  <td>http://www.frank.com</td> 
</tr> 
</tbody>
<table>

3.调用排序js代码

<script type="text/javascript">
$(document).ready(function() {
  $("#mytable").tablesorter();
});
</script>

再回到页面点击第一行就可以进行排序了.

ps:

  1.一定要引jQuery包,所有jq插件都是基于jQuery包的

  2.如果想指定哪一栏不排序这样写

    $("#mytable").tablesorter({headers:{5:{sorter:false}}});

  第5列的sorter为false就OK了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JXTree对象,读取外部xml文件数据,生成树的函数
Apr 02 Javascript
jQuery探测位置的提示弹窗(toolTip box)详细解析
Nov 14 Javascript
jquery搜索框效果实现方法
Jan 16 Javascript
jQuery使用post方法提交数据实例
Mar 25 Javascript
js生成验证码并直接在前端判断
May 15 Javascript
基于js里调用函数时,函数名带括号和不带括号的区别
Jul 28 Javascript
js实现图片缓慢放大缩小效果
Aug 02 Javascript
webpack踩坑之路图片的路径与打包
Sep 05 Javascript
使用typescript改造koa开发框架的实现
Feb 04 Javascript
Vue filter 过滤器、以及在table中的使用介绍
Sep 07 Javascript
在vue中给后台接口传的值为数组的格式代码
Nov 12 Javascript
浅谈JSON5解决了JSON的两大痛点
Dec 14 Javascript
详解angularjs结合pagination插件实现分页功能
Feb 10 #Javascript
js仿QQ邮箱收件人选择与搜索功能
Feb 10 #Javascript
BootStrapValidator初使用教程详解
Feb 10 #Javascript
bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法
Feb 10 #Javascript
JavaScript轻松创建级联函数的方法示例
Feb 10 #Javascript
JS实现的数字格式化功能示例
Feb 10 #Javascript
Vue.js 2.0窥探之Virtual DOM到底是什么?
Feb 10 #Javascript
You might like
令PHP初学者头疼十四条问题大总结
2008/11/12 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
php中使用Ajax时出现Error(c00ce56e)的详细解决方案
2014/11/03 PHP
PHP生成不重复随机数的方法汇总
2014/11/19 PHP
解决tp5在nginx下修改配置访问的问题
2019/10/16 PHP
纯js分页代码(简洁实用)
2013/11/05 Javascript
分享bootstrap学习笔记心得(组件及其属性)
2017/01/11 Javascript
node.js平台下的mysql数据库配置及连接
2017/03/31 Javascript
vue实现百度搜索下拉提示功能实例
2017/06/14 Javascript
使用AngularJS对表单提交内容进行验证的操作方法
2017/07/12 Javascript
Vue 理解之白话 getter/setter详解
2019/04/16 Javascript
微信小程序调用后台service教程详解
2020/11/06 Javascript
[36:09]Secret vs VG 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.24
2019/09/10 DOTA
[04:51]TI10典藏宝瓶Ⅱ外观视频展示
2020/08/15 DOTA
python正则表达式修复网站文章字体不统一的解决方法
2013/02/21 Python
python正则表达式判断字符串是否是全部小写示例
2013/12/25 Python
python2.7 mayavi 安装图文教程(推荐)
2017/06/22 Python
浅谈python import引入不同路径下的模块
2017/07/11 Python
详谈python在windows中的文件路径问题
2018/04/28 Python
在python里面运用多继承方法详解
2019/07/01 Python
如何爬取通过ajax加载数据的网站
2019/08/15 Python
使用python快速在局域网内搭建http传输文件服务的方法
2019/11/14 Python
python如何基于redis实现ip代理池
2020/01/17 Python
Python识别html主要文本框过程解析
2020/02/18 Python
html5手机端页面可以向右滑动导致样式受影响的问题
2018/06/20 HTML / CSS
前端实现背景虚化但内容清晰且自适应 的实例代码
2019/08/01 HTML / CSS
印度最大的网上花店:Ferns N Petals(鲜花、礼品和蛋糕)
2017/10/16 全球购物
小学教师的个人自我鉴定
2013/10/24 职场文书
学生自我评价范文
2014/02/02 职场文书
《美丽的公鸡》教学反思
2014/02/25 职场文书
活动总结格式
2014/08/30 职场文书
祖国在我心中演讲稿(小学生)
2014/09/23 职场文书
学校禁毒宣传活动总结
2015/05/08 职场文书
基层医务人员三严三实心得体会
2016/01/05 职场文书
MySql数据库 查询时间序列间隔
2022/05/11 MySQL
Win10玩csgo闪退如何解决?Win10玩csgo闪退的解决方法
2022/07/23 数码科技