项目中有一个需求，需要将动态生成的表格数据根据某一行进行排序。由于表格的数据由多次ajax请求拼接来的，从后台
进行排序比较复杂，所以就在网上找了表格排序的插件，tablesorter刚好满足了需求
1、引入jquery.js和jquery.tablesorter.min.js
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript" src="jquery.tablesorter.min.js"></script>
HTML代码：
<body>
<table id="myTable" class="tablesorter">
<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>[email protected]</td>
<td>50.00</td>
<td>http://www.jsmith.com</td>
</tr>
<tr>
<td>Bach</td>
<td>Frank</td>
<td>[email protected]</td>
<td>50.00</td>
<td>http://www.frank.com</td>
</tr>
<tr>
<td>Doe</td>
<td>Jason</td>
<td>[email protected]</td>
<td>100.00</td>
<td>http://www.jdoe.com</td>
</tr>
<tr>
<td>Conway</td>
<td>Tim</td>
<td>[email protected]</td>
<td>50.00</td>
<td>http://www.timconway.com</td>
</tr>
</tbody>
</table>
</body>
js代码：
<script>
$(function(){
$("#myTable").tablesorter(); //只需要这一句代码，则点击表格的第一行中的数据属性，则表格的数据则会根据该属性排序
//$("#myTable").tablesorter({sortList: [[3,0]]}); // 初始化的时候会将表格的数据根据第一行的"Due"进行降序排序
//$("#myTable").tablesorter({sortList: [[3,1]]}); // 初始化的时候会将表格的数据根据第一行的"Due"进行升序排序
})
注意：实际在项目中，用户点击查询的时候，得到的数据都是会变化的。也就是将<tbody>标签的内容清空，再
重新追加新查询的内容。这时候用$("#myTable").tablesorter({sortList: [[3,0]]});排序之后，jquery清空原有内容的作用会失效。
我的做法是在<tbody> 用empty()清空内容之后，然后用append()追加数据。
然后：
$("tbody").trigger("update"); //更新数据，须添加这一行
$("#tab").tablesorter({sortList: [[3,0]]});
这样原来的数据就会删除了，新追加的数据也会被排序
</script>
![js常用插件(四)之jsonExportExcel导出表格(后台系统必备)[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)