一個Bootstrap風格的分頁控件,對於喜歡Bootstrap簡潔美觀和扁平化的同學可以關注jBootstrapPage, 目前jBootstrapPage最新版為V0.1,后續還有更多功能需要完善。
demo演示地址: http://www.it175.cn/demo/jBootstrapPage/

代碼示例:
html代碼
<html> <head> <link href="jBootsrapPage.css" rel="stylesheet" /> <script src="jquery-1.10.2.min.js"></script> <script src="jBootstrapPage.js"></script> </head> <body> <div> <ul class="pagination"></ul> </div> <body> </html>
javascript代碼調用
每頁顯示多少條數據(pageSize),顯示多少個分頁按鈕(buttons),傳入數據總行數(total)即可, 如果需要在選中某一頁,然后去請求服務器端,可以在onPageClicked回調函數中完成。
<script type="text/javascript"> $(function(){ createPage(10, 13, 150); function createPage(pageSize, buttons, total) { $(".pagination").jBootstrapPage({ pageSize : pageSize, total : total, maxPageButton:buttons, onPageClicked: function(obj, pageIndex) { alert((pageIndex+1)+'頁'); } }); } }); </script>
源碼下載地址:https://github.com/wangwei123/jBootstrapPage
