jQuery外掛程式pagination實現分頁特效,jquerypagination

來源:互聯網
上載者:User

jQuery外掛程式pagination實現分頁特效,jquerypagination

實用jQuery分頁特效外掛程式jquery.pagination.js,基於jQuery實現,可根據pageselectCallback函數callback調用通過ajax調用動態資料,目前的方法是產生JSON資料到JS檔案,調用的資料是JSON格式資料,缺點是資料是一次性讀出來的,效率會差些,外掛程式支援眾多參數的自訂配置功能,還是很不錯的,大家可以根據自己的想法進行改進。

使用方法:

1.載入外掛程式和jQuery

<link rel="stylesheet" href="pagination.css"> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.pagination.js"></script> 

2.HTML內容

複製代碼 代碼如下:
<div class="pagination"></div>

3.函數調用

<script type="text/javascript"> function pageselectCallback(page_index, jq){         alert(page_index);         return false;       } $(document).ready(function(){ $(".pagination").pagination(100, {   callback: pageselectCallback,      num_edge_entries: 1,     }); }); </script> 

參數配置解釋

參數名 參數說明 可選值 預設值

callback 點擊分頁按鈕的回呼函數 函數 function(){return false;}
current_page 初始化時選中的頁碼 數字 0
items_per_page 每頁每頁顯示的記錄條數 數字 10
link_to 分頁連結 字串 #
num_display_entries 最多顯示的頁碼數 數字 11
next_text ‘下一頁'顯示的文字 字串 Next
next_show_always 如果設定為false‘下一頁'按鈕只有在還能增加頁碼的情況下才顯示 布爾值 true
prev_show_always 如果設定為false‘上一頁'按鈕只有在還能導航到前一頁的情況下才顯示 布爾值 true
prev_text ‘上一頁'顯示的文字 字串 Previous
num_edge_entries 如果設為1,那麼永遠會顯示首頁和末頁 1或0 0
ellipse_text 從當前頁碼段到首頁或末頁之間的標識字串 字串 …
load_first_page 如果設定為true,那麼回呼函數將在外掛程式初始化時就執行 布爾值 true

查看DEMO   外掛程式下載

以上所述就是本文的全部內容了,希望大家能夠喜歡。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.