JQuery分頁插件封裝（源碼來自百度，自己封裝）

-Advertisement-

最近由於項目的需要，做了一個基於JQuery的表格分頁插件封裝，部分源碼來源百度，經由自己封裝完成。下麵是具體代碼和說明，僅供參考。第一步可以先將我的HTML，CSS，JS這三部分的代碼創建好後先運行看看，下圖是文件目錄展示。 html CSS js 好了，到了這裡如果你完成了創建並且運行可以看到 ...

最近由於項目的需要，做了一個基於JQuery的表格分頁插件封裝，部分源碼來源百度，經由自己封裝完成。

下麵是具體代碼和說明，僅供參考。第一步可以先將我的HTML，CSS，JS這三部分的代碼創建好後先運行看看，下圖是文件目錄展示。

html

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery表格分頁</title>
<link rel="stylesheet" href="css/Pagebar_PC.css">
</head>
<body>
    <input type='hidden' id='current' />
    <input type='hidden' id='show' />
    <table id="y1">
        <tr>
            <th>標題1</th>
            <th>標題2</th>
            <th>標題3</th>
            <th>標題4</th>
            <th>標題5</th>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>2</td>
            <td>2</td>
            <td>2</td>
            <td>2</td>
            <td>2</td>
        </tr>
        <tr>
            <td>3</td>
            <td>3</td>
            <td>3</td>
            <td>3</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>4</td>
            <td>4</td>
            <td>4</td>
            <td>4</td>
        </tr>
        <tr>
            <td>5</td>
            <td>5</td>
            <td>5</td>
            <td>5</td>
            <td>5</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
            <td>15</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
            <td>15</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
            <td>15</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
            <td>15</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
            <td>15</td>
        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td>24</td>
            <td>25</td>
        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td>24</td>
            <td>25</td>
        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td>24</td>
            <td>25</td>
        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td>24</td>
            <td>25</td>
        </tr>
        <tr>
            <td>21</td>
            <td>22</td>
            <td>23</td>
            <td>24</td>
            <td>25</td>
        </tr>
        <tr>
            <td>31</td>
            <td>32</td>
            <td>33</td>
            <td>34</td>
            <td>35</td>
        </tr>
        <tr>
            <td>31</td>
            <td>32</td>
            <td>33</td>
            <td>34</td>
            <td>35</td>
        </tr>
        <tr>
            <td>31</td>
            <td>32</td>
            <td>33</td>
            <td>34</td>
            <td>35</td>
        </tr>
        <tr>
            <td>31</td>
            <td>32</td>
            <td>33</td>
            <td>34</td>
            <td>35</td>
        </tr>
        <tr>
            <td>31</td>
            <td>32</td>
            <td>33</td>
            <td>34</td>
            <td>35</td>
        </tr>
        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td>44</td>
            <td>45</td>
        </tr>
        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td>44</td>
            <td>45</td>
        </tr>
        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td>44</td>
            <td>45</td>
        </tr>
        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td>44</td>
            <td>45</td>
        </tr>
        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td>44</td>
            <td>45</td>
        </tr>
        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
            <td>54</td>
            <td>55</td>
        </tr>
        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
            <td>54</td>
            <td>55</td>
        </tr>
        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
            <td>54</td>
            <td>55</td>
        </tr>
        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
            <td>54</td>
            <td>55</td>
        </tr>
        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
            <td>54</td>
            <td>55</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </table>
    <div id='page_nav_y1'></div>
    <script type="text/javascript" src="js/jquery.js"></

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

spring自帶定時器@Scheduled註解配置

1.僅需引入spring相關的包。 2.在xml裡加入task的命名空間 3.配置定時任務的線程池 4.寫定時任務總結： 1.配置定時任務線程池可以同時執行同一時間的任務，否則是按照順序執行。 2.如果xml裡面開啟的懶載入，default-lazy-init="true"，需要有@Lazy(fa ...
SpringBoot學習：整合shiro（rememberMe記住我後自動登錄session失效解決辦法）

項目下載地址：http://download.csdn.NET/detail/aqsunkai/9805821 定義一個攔截器，判斷用戶是通過記住我登錄時，查詢資料庫後臺自動登錄，同時把用戶放入session中。配置攔截器也很簡單，Spring 為此提供了基礎類WebMvcConfigurerAd ...
C#設計模式：責任鏈模式

設計模式是面向對象編程的基礎，是用於指導程式設計。在實際項目開發過程中，並不是一味將設計模式進行套用，也不是功能設計時大量引入設計模式。應該根據具體需求和要求應用適合的設計模式。設計模式是一個老話題了，因為最近在設計“網關API”組件（後續介紹），採用“責任鏈設計模式”進行設計，所以先進行回顧記錄。 ...
互聯網電商購物車架構演變案例

購物車主要作用在於：1、和傳統賣場類似，方便用戶一次選擇多件商品去結算。2、充當臨時收藏夾的功能。3、對於商家來說，購物車是向用戶推銷的最佳場所之一。早期 ERP拆分業務服務化拆分 WCS拆分購物車功能模塊概況層級設計群集設計雲購物車從應用層面上設計了三個—— 交互層、業務... ...
Java 設計模式(三)-單例模式(Singleton Pattern)

1 概念定義 1 概念定義 1.1 定義確保一個類只有一個實例，而且自行實例化並向整個系統提供這個實例。 1.2 類型創建類模式 1.3 難點 1）多個虛擬機當系統中的單例類被拷貝運行在多個虛擬機下的時候，在每一個虛擬機下都可以創建一個實例對象。在使用了 EJB、JINI、RMI 技術的分佈 ...
SpringBoot學習：獲取yml和properties配置文件的內容

項目下載地址：http://download.csdn.net/detail/aqsunkai/9805821 （一）yml配置文件： pom.xml加入依賴：在application.yml文件中加上：使用一個java類獲取yml文件的內容：通過依賴註入就可以獲取該對象：方法內獲取值：（ ...
博客皮膚的設計

第一次寫博客，有點小激動。由於我的興趣方向是web前端，所以就給自己設計了個頁面。這個頁面的主要特點就是磨砂效果，還有背景固定效果。靜止不動首先想到的就是position: fixed，只要將背景圖填滿全屏，再設置固定定位就可以了。不過要註意不能把#home當做固定背景，否則子元素也會固定，滾動條 ...
jacascript DOM節點——節點內容

前言：這是筆者學習之後自己的理解與整理。如果有錯誤或者疑問的地方，請大家指正，我會持續更新！ innerHTML 在讀模式下，返回與調用元素的所有子節點(包括元素、註釋和文本節點)對應的 HTML 標記；在寫模式下，innerHTML 會根據指定的值創建新的 DOM 樹，然後用這個 DOM 樹完全 ...