1、簡單直接貼代碼 需要引用以下樣式和腳本
<link href="~/Scripts/Page/pager.css" rel="stylesheet" /> <script src="~/Scripts/jQuery-1.8.3.js"></script> <script src="~/Scripts/Page/jquery.pager.js"></script>
page.css代碼如下
#pager ul.pages { display:block; border:none; text-transform:uppercase; font-size:10px; margin:10px 0 50px; padding:0; } #pager ul.pages li { list-style:none; float:left; border:1px solid #ccc; text-decoration:none; margin:0 5px 0 0; padding:5px; } #pager ul.pages li:hover { border:1px solid #003f7e; } #pager ul.pages li.pgEmpty { border:1px solid #eee; color:#eee; } #pager ul.pages li.pgCurrent { border:1px solid #003f7e; color:#000; font-weight:700; background-color:#eee; }
2、HTML代碼
<div id="pager" class="page"> </div>
3、分頁插件使用
pagenumber頁碼,
pagecount分頁數量,
buttonClickCallback點擊分頁的函數,
TotalCount記錄總數
PageEnter:true 跳頁false不跳頁
<script type="text/javascript"> $("#pager").pager({ pagenumber: pageclickednumber, pagecount: Math.ceil(total / 8), buttonClickCallback: PageClick, TotalCount: total, PageEnter: true }); PageClick = function (pageclickednumber) { } </script>
效果如下:
QQ:;.net技術討論群: