<html>

<head>

<title>tablesorter表单排序插件</title>

        <link type ="text/css" href="default.css" rel="stylesheet" />

	<script type="text/javascript" src="jquery-1.5.1.js"></script>

	<script type="text/javascript" src="jquery.metadata.js"></script>

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

	<script type="text/javascript">

	//以下代码表示对特定的Table排序

	$(function() {

		$("#feigeTable").tablesorter();

                //$("#largess1").tablesorter();

	});

		</script>

</head>

<body>

<h3><td class="{sortValue: 0}">80</td>表示自定义的顺序，表示单击该列时，80排到第一的位置</h3>

<table id="feigeTable" cellspacing="0">

	<thead>

		<tr>

			<th>Name</th>

			<th>Major</th>

			<th>Sex</th>

			<th>English</th>

			<th>Japanese</th>

			<th>Calculus</th>

                        <th>Geometry</th>

			<th>Geometry</th>

		</tr>

	</thead>

	<tfoot>

		<tr>

			<th>Name</th>

			<th>Major</th>

			<th>Sex</th>

			<th>English</th>

			<th>Japanese</th>

			<th>Calculus</th>

			<th>Geometry</th>

			<th>Geometry</th>

		</tr>

	</tfoot>

	<tbody id="feige">

		<tr>

			<td>买</td>

			<td>Languages</td>

			<td>male</td>

			<td >80</td>

			<td>70</td>

			<td>75</td>

			<td>80</td>

			<td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>卖</td>

			<td>Mathematics</td>

			<td>male</td>

			<td>90</td>

			<td>88</td>

			<td>100</td>

			<td>90</td>

                        <td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>买</td>

			<td>Languages</td>

			<td>female</td>

			<td>85</td>

			<td>95</td>

			<td>80</td>

			<td>85</td>

			<td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>卖</td>

			<td>Languages</td>

			<td>male</td>

			<td>60</td>

			<td>90</td>

			<td>100</td>

			<td>100</td>

			<td><select><option>angus</option><option>zebra</option></select></td>

		</tr>

	</tbody>

</table>

<h3>只是第二个表单，没有排序</h3>

<table id="feigeTable2" cellspacing="0">

	<thead>

		<tr>

			<th>Name</th>

			<th>Major</th>

			<th>Sex</th>

			<th class="{sorter:'metadata'}">English</th>

			<th>Japanese</th>

			<th>Calculus</th>

                        <th>Geometry</th>

			<th>Geometry</th>

		</tr>

	</thead>

	<tfoot>

		<tr>

			<th>Name</th>

			<th>Major</th>

			<th>Sex</th>

			<th>English</th>

			<th>Japanese</th>

			<th>Calculus</th>

			<th>Geometry</th>

			<th>Geometry</th>

		</tr>

	</tfoot>

	<tbody id="feige1">

		<tr>

			<td>买</td>

			<td>Languages</td>

			<td>male</td>

			<td class="{sortValue: 0}">80</td>

			<td>70</td>

			<td>75</td>

			<td>80</td>

			<td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>卖</td>

			<td>Mathematics</td>

			<td>male</td>

			<td class="{sortValue: 1}">90</td>

			<td>88</td>

			<td>100</td>

			<td>90</td>

                        <td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>买</td>

			<td>Languages</td>

			<td>female</td>

			<td class="{sortValue: 2}">85</td>

			<td>95</td>

			<td>80</td>

			<td>85</td>

			<td><select><option>brian</option><option>christian</option></select></td>

		</tr>

		<tr>

			<td>卖</td>

			<td>Languages</td>

			<td>male</td>

			<td class="{sortValue: 3}">60</td>

			<td>90</td>

			<td>100</td>

			<td>100</td>

			<td><select><option>angus</option><option>zebra</option></select></td>

		</tr>

	</tbody>

</table>

</body>

</html>
http://files.cnblogs.com/files/feige/Table%E6%8E%92%E5%BA%8Ftablesorter%E6%8F%92%E4%BB%B6.rar

Table排序的更多相关文章

  1. lua table排序报错与解决

    lua table排序 table的sort函数 比如按照大小进行排序,下面这种写法在某些情况下可能会排序错误,甚至报invalid order function for sorting table. ...

  2. javascript table排序之jquery.tablesorter.js

    table排序 jquery.tablesorter.js 一.Demo下载地址: 1.tablesorter.js下载地址: http://download.csdn.net/detail/zhan ...

  3. js实现table排序（jQuery下的jquery.sortElements）

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

  4. lua的table排序

    lua中利用到的排序的基本上就是构造函数(table)了,为了便于和C区分开来,我俗称它为表单. 实例:(原理就是LUA集成的冒泡算法) 排序的一般姿势(对于只包含数字或者只包含字符串的简单数组) t ...

  5. lua table 排序--满足多条件排序

    前提 假设 一个小怪 有三种属性,等级(level).品质(quality).id(pid) 我们需要对他们进行排序,两种排序情况,第一是单一属性排序,比如按照等级进行排序,或者多种属性进行优先级排序 ...

  6. js实现table排序-sortable.js

    方案一.引用sortable.js包 /* <th class="thcss" style="width: 40px;" onclick="so ...

  7. DWZ (JUI) 教程 table 排序

    dwz排序是后台排序,不是前台的js排序,他的流程和搜索,分页是一样的,当你点击排序的按钮时,从新发送请求刷新当前的navTable 和 dialog. <th width="60&q ...

  8. VUE +element el-table运用sortable 拖拽table排序，实现行排序，列排序

    Sortable.js是一款轻量级的拖放排序列表的js插件(虽然体积小,但是功能很强大) 项目需求是要求能对element中 的table进行拖拽行排序 这里用到了sorttable Sortable ...

  9. jQuery对table排序

    <script> //col对应列,cmp两数比较方法,返回值为TRUE,FALSE function sort(col, cmp) { var table = $("#test ...

随机推荐

  1. 2016 年 50 个最佳的轻量级 JavaScript 框架和库

    作者:IT程序狮链接:https://zhuanlan.zhihu.com/p/24598210来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 回顾今年已发布的 JS ...

  2. eclipse如何快速查找某个类

    2. [Ct rl+Shift +T ]    查找工作空间(Workspace)构建路径中的可找到Java类文件,不要为找不到类而痛苦,而且可以使用“*”.“?”等通配符. 3. 当我们编写了很多的 ...

  3. Linux学习笔记

    性能问题排查: Linux系统出现了性能问题,一般我们可以通过top.iostat.free.vmstat等命令来查看初步定位问题.内存资源占用:free命令 IO占用:iostat -d -k 1 ...

  4. 4. Decision Tree

    一般的,一颗决策树包含一个根结点.若干内部结点和若干叶结点:叶节点对应于决策结果,其他每个结点则对应于一个属性测试:每个结点包含的样本集合根据属性测试的结果被划分到子结点中:根结点包含样本全集.从根结 ...

  5. Python开发【第九章】：堡垒机实例

    一.堡垒机前戏 开发堡垒机之前,先来学习Python的paramiko模块,该模块基于SSH用于连接远程服务器并执行相关操作 模块安装 C:\Program Files\Python 3.5\Scri ...

  6. Sublime、Webstorm，还有CLI、Atom，这些开发工具的更新你清楚吗？

    APICloud App开发平台一直在不断升级开发工具库,这一年增加了众多开发工具.目的就是让开发者可以选择使用任何自己喜欢的HTML5开发工具去开发App. 那么2016年到现在,这些开发工具都有了 ...

  7. mybatis---实现关联表查询

    推荐学习博客: 1.http://www.cnblogs.com/xdp-gacl/p/4264440.html 2.http://www.cnblogs.com/yaobolove/p/544404 ...

  8. 3个著名加密算法(MD5、RSA、DES)的解析

    MD5的全称是Message-Digest Algorithm 5,在90年代初由MIT的计算机科学实验室和RSA Data Security Inc发明,经MD2.MD3和MD4发展而来.    M ...

  9. poj 2393 Yogurt factory

    http://poj.org/problem?id=2393 Yogurt factory Time Limit: 1000MS   Memory Limit: 65536K Total Submis ...

  10. Ubuntu16.04 802.1x 有线连接 输入账号密码，为什么连接不上？

    ubuntu16.04,在网络配置下找到802.1x安全性,输入账号密码,为什么连接不上?   这是系统的一个bug解决办法:假设你有一定的ubuntu基础,首先你先建立好一个不能用的协议,就是按照之 ...