jQuery plugin: Tablesorter 2.0
http://mottie.github.io/tablesorter/docs/example-pager.html
http://tablesorter.com/docs/example-pager.html
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
- <title>jQuery plugin: Tablesorter 2.0 - Pager plugin</title>
- <!-- jQuery -->
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
- <!-- Demo stuff -->
- <link rel="stylesheet" href="css/jq.css"/>
- <link href="css/prettify.css" rel="stylesheet"/>
- <script type="text/javascript" src="js/prettify.js"></script>
- <script type="text/javascript" src="js/docs.js"></script>
- <!-- Tablesorter: required -->
- <link rel="stylesheet" href="themes/blue/theme.blue.css"/>
- <script type="text/javascript" src="js/jquery.tablesorter.js"></script>
- <!-- Tablesorter: optional -->
- <link rel="stylesheet" href="css/jquery.tablesorter.pager.css"/>
- <script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
- <script type="text/javascript" src="js/settablepage.js" id="js"></script>
- </head>
- <body>
- <div class="pager">
- <img src="scripts/first.png" class="first" alt="First" />
- <img src="scripts/prev.png" class="prev" alt="Prev" />
- <span class="pagedisplay"></span> <!-- this can be any element, including an input -->
- <img src="scripts/next.png" class="next" alt="Next" />
- <img src="scripts/last.png" class="last" alt="Last" />
- <select class="pagesize" title="Select page size">
- <option value="10">10</option>
- <option value="20">20</option>
- <option value="30">30</option>
- <option value="40">40</option>
- </select>
- <select class="gotoPage" title="Select page number"></select>
- </div>
- <table class="tablesorter">
- <thead>
- <tr>
- <th>Name</th>
- <th>Major</th>
- <th>Sex</th>
- <th>English</th>
- <th>Japanese</th>
- <th>Calculus</th>
- <th>Geometry</th>
- <th class="remove sorter-false"></th>
- </tr>
- </thead>
- <tfoot>
- <tr>
- <th>Name</th>
- <th>Major</th>
- <th>Sex</th>
- <th>English</th>
- <th>Japanese</th>
- <th>Calculus</th>
- <th>Geometry</th>
- <th></th>
- </tr>
- </tfoot>
- <tbody>
- <tr>
- <td>Student01</td>
- <td>Languages</td>
- <td>male</td>
- <td>80</td>
- <td>70</td>
- <td>75</td>
- <td>80</td>
- <td></td>
- </tr>
- <tr>
- <td>Student02</td>
- <td>Mathematics</td>
- <td>male</td>
- <td>90</td>
- <td>88</td>
- <td>100</td>
- <td>90</td>
- <td></td>
- </tr>
- <tr>
- <td>Student03</td>
- <td>Languages</td>
- <td>female</td>
- <td>85</td>
- <td>95</td>
- <td>80</td>
- <td>85</td>
- <td></td>
- </tr>
- <tr>
- <td>Student04</td>
- <td>Languages</td>
- <td>male</td>
- <td>60</td>
- <td>55</td>
- <td>100</td>
- <td>100</td>
- <td></td>
- </tr>
- <tr>
- <td>Student05</td>
- <td>Languages</td>
- <td>female</td>
- <td>68</td>
- <td>80</td>
- <td>95</td>
- <td>80</td>
- <td></td>
- </tr>
- <tr>
- <td>Student06</td>
- <td>Mathematics</td>
- <td>male</td>
- <td>100</td>
- <td>99</td>
- <td>100</td>
- <td>90</td>
- <td></td>
- </tr>
- <tr>
- <td>Student07</td>
- <td>Mathematics</td>
- <td>male</td>
- <td>85</td>
- <td>68</td>
- <td>90</td>
- <td>90</td>
- <td></td>
- </tr>
- <tr>
- <td>Student08</td>
- <td>Languages</td>
- <td>male</td>
- <td>100</td>
- <td>90</td>
- <td>90</td>
- <td>85</td>
- <td></td>
- </tr>
- <tr><td>Student23</td><td>塗聚文</td><td>男</td><td>82</td><td>77</td><td>0</td><td>79</td><td></td></tr>
- <tr><td>Student24</td><td>劉亮</td><td>女</td><td>100</td><td>91</td><td>13</td><td>82</td><td></td></tr>
- <tr><td>Student25</td><td>涂聚文</td><td>男</td><td>22</td><td>96</td><td>82</td><td>53</td><td></td></tr>
- <tr><td>Student26</td><td>曾用名</td><td>女</td><td>37</td><td>29</td><td>56</td><td>59</td><td></td></tr>
- <tr><td>Student27</td><td>一落千丈</td><td>male</td><td>86</td><td>82</td><td>69</td><td>23</td><td></td></tr>
- <tr><td>Student28</td><td>共青团</td><td>female</td><td>44</td><td>25</td><td>43</td><td>1</td><td></td></tr>
- <tr><td>Student29</td><td>生龙活虎</td><td>male</td><td>77</td><td>47</td><td>22</td><td>38</td><td></td></tr>
- <tr><td>Student30</td><td>语言</td><td>female</td><td>19</td><td>35</td><td>23</td><td>10</td><td></td></tr>
- <tr><td>Student31</td><td>物理</td><td>male</td><td>90</td><td>27</td><td>17</td><td>50</td><td></td></tr>
- <tr><td>Student32</td><td>物色</td><td>female</td><td>60</td><td>75</td><td>33</td><td>38</td><td></td></tr>
- <tr><td>Student33</td><td>Mathematics</td><td>male</td><td>4</td><td>31</td><td>37</td><td>15</td><td></td></tr>
- <tr><td>Student34</td><td>Languages</td><td>female</td><td>77</td><td>97</td><td>81</td><td>44</td><td></td></tr>
- <tr><td>Student35</td><td>Mathematics</td><td>male</td><td>5</td><td>81</td><td>51</td><td>95</td><td></td></tr>
- <tr><td>Student36</td><td>Languages</td><td>female</td><td>70</td><td>61</td><td>70</td><td>94</td><td></td></tr>
- <tr><td>Student37</td><td>Mathematics</td><td>male</td><td>60</td><td>3</td><td>61</td><td>84</td><td></td></tr>
- <tr><td>Student38</td><td>Languages</td><td>female</td><td>63</td><td>39</td><td>0</td><td>11</td><td></td></tr>
- <tr><td>Student39</td><td>Mathematics</td><td>male</td><td>50</td><td>46</td><td>32</td><td>38</td><td></td></tr>
- <tr><td>Student40</td><td>Languages</td><td>female</td><td>51</td><td>75</td><td>25</td><td>3</td><td></td></tr>
- <tr><td>Student41</td><td>Mathematics</td><td>male</td><td>43</td><td>34</td><td>28</td><td>78</td><td></td></tr>
- <tr><td>Student42</td><td>Languages</td><td>female</td><td>11</td><td>89</td><td>60</td><td>95</td><td></td></tr>
- <tr><td>Student43</td><td>Mathematics</td><td>male</td><td>48</td><td>92</td><td>18</td><td>88</td><td></td></tr>
- <tr><td>Student44</td><td>Languages</td><td>female</td><td>82</td><td>2</td><td>59</td><td>73</td><td></td></tr>
- <tr><td>Student45</td><td>Mathematics</td><td>male</td><td>91</td><td>73</td><td>37</td><td>39</td><td></td></tr>
- <tr><td>Student46</td><td>Languages</td><td>female</td><td>4</td><td>8</td><td>12</td><td>10</td><td></td></tr>
- <tr><td>Student47</td><td>Mathematics</td><td>male</td><td>89</td><td>10</td><td>6</td><td>11</td><td></td></tr>
- <tr><td>Student48</td><td>Languages</td><td>female</td><td>90</td><td>32</td><td>21</td><td>18</td><td></td></tr>
- <tr><td>Student49</td><td>Mathematics</td><td>male</td><td>42</td><td>49</td><td>49</td><td>72</td><td></td></tr>
- <tr><td>Student50</td><td>Languages</td><td>female</td><td>56</td><td>37</td><td>67</td><td>54</td><td></td></tr>
- </tbody>
- </table>
- <div class="pager">
- <img src="scripts/first.png" class="first" alt="First" />
- <img src="scripts/prev.png" class="prev" alt="Prev" />
- <span class="pagedisplay"></span> <!-- this can be any element, including an input -->
- <img src="scripts/next.png" class="next" alt="Next" />
- <img src="scripts/last.png" class="last" alt="Last" />
- <select class="pagesize" title="Select page size">
- <option value="10">10</option>
- <option value="20">20</option>
- <option value="30">30</option>
- <option value="40">40</option>
- </select>
- <select class="gotoPage" title="Select page number"></select>
- </div>
- </body>
- </html>
jQuery plugin: Tablesorter 2.0的更多相关文章
- javascript:jQuery tablesorter 2.0
https://mottie.github.io/tablesorter/docs/index.html 1.GridView <%@ Page Language="C#" ...
- The ultimate jQuery Plugin List(终极jQuery插件列表)
下面的文章可能出自一位奥地利的作者, 列出很多jQuery的插件.类似的网站:http://jquerylist.com/原文地址: http://www.kollermedia.at/archiv ...
- jQuery plugin: Autocomplete 参数及实例
官网:jQuery plugin: Autocomplete (注:此插件已经不再更新.它的继任者是jQuery UI的一部分,) 此插件依赖于 jquery 1.2.6 --- j ...
- [jQuery] 自做 jQuery Plugin - Part 1
有時候寫 jQuery 時,常會發現一些簡單的效果可以重複利用.只是每次用 Copy & Paste 大法似乎不是件好事,有沒有什麼方法可以讓我們把這些效果用到其他地方呢? 沒錯,就是用 jQ ...
- Element DOM Tree jQuery plugin – Firebug like functionality | RockingCode
Element DOM Tree jQuery plugin – Firebug like functionality | RockingCode Element DOM Tree jQuery pl ...
- HTML5 Video player jQuery plugin
<!DOCTYPE html> <html lang="en" > <head> <meta charset="utf-8&qu ...
- JQuery Plugin 开发
学习 JQuery 插件开发之后, 可以将自己平时常用的功能封装成插件, 便于在不同的项目之间使用. JQuery 官网上的 插件开发教程就很不错, 简单易懂. 参考网址: http://learn. ...
- JQuery plugin ---- simplePagination.js API
CSS Themes "light-theme" "dark-theme" "compact-theme" How To Use Step ...
- jquery中$("#afui").get(0)为什么要加get(0)呢?
jquery中$("#afui").get(0)为什么要加get(0)呢? 2015-04-13 17:46SYYZZ3 | 浏览 509 次 Jquery $("#a ...
随机推荐
- Github 三种克隆模式
1.我称为平常模式,用于项目的本地克隆使用.(无权限.无加密.ssh protocol) git clone http://github.com/username/exampleproject 2.我 ...
- ArcGIS10.4破解
arcgis 10.4破解方法 *注意!Desktop,Engine,Server必须为同一版本* Engine10.4破解失败,SDE10.4未进行破解 1.先安装License10.4 2.再安装 ...
- leetcode-229.求众数(二)
题目: 给定一个大小为 n 的数组,找出其中所有出现超过 ⌊ n/3 ⌋ 次的元素. 说明: 要求算法的时间复杂度为O(n),空间复杂度为O(1). 示例 1: 输入: [3,2,3] 输出: [3 ...
- JS 方法注入 attachEvent
写法1: <html> <head> <title></title> <script language="javascript" ...
- 网络控制芯片AX88796B系列使用简介
目录 1. 特性 2. 结构框图 3. 接收 3.1 缓存空间 3.2 Receiver Buffer Ring 3.3 接收机制 4. 发送 5. 编程过程简要说明 5.1 初始化配置 5.2 接收 ...
- Ubuntu Server 中实际内存与物理内存不相等的问题
记录 来源 v2ex,提到了一个平时不是很起眼的问题,Ubuntu Server 中系统默认会占用 128M 内存,用于 CVM 内部的 kdump 服务. 科普 查看 CVM 所拥有的物理内存 通过 ...
- EasyUI学习笔记(二)—— Layout
一.layout页面布局 EasyUI布局容器包括东.西.南.北.中五个区域,其中中心面板是必须的,而东.西.南.北这四个面板是可选的,如果布局里面不需要东.西.南.北这四个面板,那么可以把相应的di ...
- C++_类入门1-对象和类的介绍
面向对象是(OOP)是特殊的.设计程序的概念性方法:包含以下特性: 抽象: 封装和数据隐藏: 多态: 继承: 代码的可重用性: 为了实现这些特性并且将这些特性组合在一起,C++所做的最重要的改进是提供 ...
- docker image rm ubuntu 失败
[root@hadoop14 ~]# docker image rm ubuntu Failed to remove image (ubuntu:v2): Error response from da ...
- xml转换csv
/// <summary> /// xml文件转换为CSV /// </summary> /// <param name="fileName"> ...