利用jquery的jquery.tablesorter.js来实现,不依赖别的东西
1.下载jquery.tablesorter.js
2.创建表格(一定要按照thead和tbody的格式才支持)
<table class="table table-bordered table-hover" style="margin-bottom: 10px;" id="mytable">
<thead>
<tr>
<th>IP</th>
<th>IDC</th>
<th>部门</th>
<th>负责人</th>
</tr>
</thead>
<tbody>
<tr>
<td>192.168.1.1</td>
<td>宿迁</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>192.168.1.2</td>
<td>亦庄</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>192.168.1.3</td>
<td>廊坊</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>192.168.1.4</td>
<td>宿迁</td>
<td>1</td>
<td>1</td>
</tr>
</tbody>
</table>
3.创建自执行函数
<!-- 引入jquery文件忽略-->
<script src="/static/js/jquery.tablesorter.js"></script>
<script type="text/javascript">
$(function (){
$("#mytable").tablesorter();
})
</script>
4.验证排序功能
点击thead里面的对应的标题项看结果
网友评论