点击图标实现table数据的排序

我们在很多时候会用到对数据的排序，但是如果当点击图标后从数据库来重新排序的话，当数据量过大的时候会给数据库很大的压力。所以使用tablesort来更新排序。
首先导入jquery.tablesorter.js和css。要注意的是在css中要修改图标的位置，因为你图片存放位置不一定一样。
并且需要注意的是：一定要给table加thead属性，不然实现不了

<table class="table table-striped table-bordered table-hover table-condensed" id="sortTable" style="margin-top: 15px;margin-left: 50px;width: 800px">
            <thead>
                <tr>
                    <th>渠道</th>
                    <th>激活数</th>
                    <th>广告点1</th>
                    <th>广告点2</th>
                    <th style="text-align: center">操作</th>
                </tr>
            </thead>
            <tbody style="text-align: center">
            <c:forEach items="${list}" var="users">
                <tr>
                    <td>${users.name}</td>
                    <td>${users.app_id}</td>
                    <td>${users.user_id}</td>
                    <td>${users.created_at}</td>
                    <td>
                        <a href="/jumpManager/delete?id=${users.id}&app=${users.app}" >删除</a>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>

如果需要对某一列不进行排序可以这么写
 

$(document).ready(function(){ //最后一列不进行排序(索引从0开始) $("#sortTable").tablesorter({headers:{4:{sorter:false}}}); });