javascript中tableSorter对表格排序使用介绍

主要是三步：

1、引入js文件

<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="js/jquery.tablesorter.js" type="text/javascript" ></script> //放在最后

2、加入js代码

<script type="text/javascript">
    $(document).ready(function(){ 
        //第一列不进行排序(索引从0開始)
        //$.tablesorter.defaults.headers = {0: {sorter: false}};
        $(".tablesorter").tablesorter(); 
    }); //这是第3步的类名class
    $('th').hover(
        function() {
            this.style.cursor = 'pointer';
            this.style.color = '#FF00FF';
        },
        function() {
            this.style.color = 'black';
        }
    );  //通过直接设置Style
</script>

3、表格设置特殊结构，并引入类class="tablesorter"供第2步引用

<table width="100%" height="103" border="0" align="center" cellpadding="0" cellspacing="1" class="tablesorter"> 
    <thead>
        <tr class="biaotou"> 
            <th scope="col">序号</th>  
            <th scope="col">姓名</th>
        </tr>
    </thead>
    <tbody>
        <tr align='center'>
            <td>数据1</td>
            <td>数据2</td>
        </tr>
    </tbody>
</table>

这里有个很好的教程：链接地址

4、以上已经可以成功了，但是如果利用ajax无刷新从后台得到数据生成表格时，就存在点击无反应的情况。此时需要更新表。

$(".tablesorter").trigger("update"); //非常关键，每次新生成的表都要更新一下

要将此行放在每次更新数据之后运行一下。