單純用JS作的分頁插件

　　最近公司須要用到分頁插件，因爲市面上大多都是jQuery的分頁插件，並且項目中有本身的工具類，因此說我在工具類中又添加了不依賴jQuery的分頁插件，並且分頁插件來講對DOM的操做也不是不少，就是用JS來操做DOM還有有一點點蛋疼的，起碼代碼看上去不是特別的簡潔美觀。

　　　下面是插件的使用方法，這個是JS代碼：

 1             pageUtil.initPage('page',{
 2                 totalCount:500,//總頁數，通常從回調函數中獲取。若是沒有數據則默認爲1頁
 3                 curPage:1,//初始化時的默認選中頁，默認第一頁。若是所填範圍溢出或者非數字或者數字字符串，則默認第一頁
 4                 showCount:9,//分頁欄顯示的數量
 5                 pageSizeList:[5,10,15,20,25,30],//自定義分頁數，默認[5,10,15,20,50]
 6                 defaultPageSize:10,//默認選中的分頁數,默認選中第一個。若是未匹配到數組或者默認數組中，則也爲第一個
 7                 isJump:true,//是否包含跳轉功能，默認false
 8                 isPageNum:true,//是否顯示分頁下拉選擇，默認false
 9                 isPN:true,//是否顯示上一頁和下一面，默認true
10                 isFL:true,//是否顯示首頁和末頁，默認true
11                 jump:function(curPage,pageSize){//跳轉功能回調，傳遞回來2個參數，當前頁和每頁大小。若是沒有設置分頁下拉，則第二個參數永遠爲0。這裏的this被指定爲一個空對象，若是回調中需用到this請自行使用bind方法
12                     console.log(curPage,pageSize);
13                 },
14             });

　　　下面是html代碼,page就是對應的id，若是不須要調整居中什麼的話，就直接使用最簡單的div就好了:

1         <div style="width: 100%;text-align: center;">
2             <div id='page'></div>
3         </div>

　　下面就是效果圖：

　　

 

　　這裏基於簡單的概念，因此我把樣式都設置成了內聯，若是須要更改顏色或者其餘的樣式，可能須要在js中更改或者使用Important強制覆蓋，可是通常只需改一個顏色就好了，也不是特別的麻煩。

 　　具體代碼怎麼實現這裏就不發了，有興趣的同窗能夠下載代碼看一下，這裏是下載地址：http://pan.baidu.com/s/1mitDfnU，代碼寫的很差請勿噴····