zoukankan      html  css  js  c++  java
  • jquery tablesorter

    参考:http://tablesorter.com/docs/

    Getting started

    To use the tablesorter plugin, include the jQuery library and the tablesorter plugin inside the <head> tag of your HTML document:

    <script type="text/javascript" src="/path/to/jquery-latest.js"></script> 
    <script type="text/javascript" src="/path/to/jquery.tablesorter.js"></script> 

    tablesorter works on standard HTML tables. You must include THEAD and TBODY tags:

    <table id="myTable"> 
    <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> 
        

    Start by telling tablesorter to sort your table when the document is loaded:

    $(document).ready(function() 
        { 
            $("#myTable").tablesorter(); 
        } 
    ); 
        

    Click on the headers and you'll see that your table is now sortable! You can also pass in configuration options when you initialize the table. This tells tablesorter to sort on the first and second column in ascending order.

    $(document).ready(function() 
        { 
            $("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} ); 
        } 
    ); 
        

    NOTE! tablesorter will auto-detect most data types including numbers, dates, ip-adresses for more information see Examples

    Full release - Plugin, Documentation, Add-ons, Themes jquery.tablesorter.zip

  • 相关阅读:
    网页自动跳转/定时跳转代码
    阿里云ECS用Xshell安装wdcp教程
    wdcp环境下更新PHP到5.3教程
    WDCP 安装教程,超简单!!
    Jquery select 三级联动 (需要JSON数据)
    Jquery实现循环删除Reaper某一行
    jquery更改Reaper某一列的值
    联系电话正则表达式(jquery表单验证)
    Jquery获取选中的checkbox的值
    sql语句创建主键、外键、索引、绑定默认值
  • 原文地址:https://www.cnblogs.com/aaa6818162/p/1606761.html
Copyright © 2011-2022 走看看