zoukankan      html  css  js  c++  java
  • jQuery 表格排序插件 Tablesorter 使用

    jQuery 表格排序插件 Tablesorter 使用方式如下:

    1.引入头文件(注意一定要把jQuery放在前面):

    <script src="lib/jquery-1.8.3.min.js"></script>
    <!--tablesorter-->
    <link href="css/css_tablesorter_green/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="lib/jquery.tablesorter.js"></script>
    <script type="text/javascript">
    		$(document).ready(function(){
    		$("#alltable").tablesorter();     
    	}); 
    </script>

    2.在需要使用排序的<Table>上无需做任何设定,很方便:

    <table id="alltable" class="tablesorter"  width="584"> 
    <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>jsmith@gmail.com</td> 
        <td>$50.00</td> 
        <td>http://www.jsmith.com</td> 
    </tr> 
    <tr> 
        <td>Bach</td> 
        <td>Frank</td> 
        <td>fbach@yahoo.com</td> 
        <td>$50.00</td> 
        <td>http://www.frank.com</td> 
    </tr> 
    <tr> 
        <td>Doe</td> 
        <td>Jason</td> 
        <td>jdoe@hotmail.com</td> 
        <td>$100.00</td> 
        <td>http://www.jdoe.com</td> 
    </tr> 
    <tr> 
        <td>Conway</td> 
        <td>Tim</td> 
        <td>tconway@earthlink.net</td> 
        <td>$50.00</td> 
        <td>http://www.timconway.com</td> 
    </tr> 
    </tbody> 
    </table> 
    

    在<thead>上就会有两个小三角符号,点击可以用于排序。


    Tablesorter下载地址:http://download.csdn.net/detail/leixiaohua1020/6377187


  • 相关阅读:
    超链接
    Image中的alt
    预格式
    json字符串转json对象,json对象转换成java对象
    google-gson 解析json
    java HTTP请求工具
    JS文件中获取contextPath的方法
    eclipse中安装freemarker插件及ftl使用freemarker编辑器
    MyBatis 传入参数之parameterType
    typeAliases别名
  • 原文地址:https://www.cnblogs.com/leixiaohua1020/p/3902116.html
Copyright © 2011-2022 走看看