nodejs+bootstrap實現分頁效果

1、資料處理

首先在動態js中，根據url參數擷取資料庫文檔的數量，設定分頁的大小，擷取當前頁面的資料，然後將文檔數量pagecount，分頁大小pagesize，以及當前頁面currentpage傳遞到頁面中。

2、處理分頁效果

我採用的是javascript動態產生的，你也可以利用ejs支援函數的特性將其封裝後產生html形式的分頁。

首先，添加分頁ul，在你的頁面中需要顯示的位置添加代碼：

<ul class="pagination" id="pagination"></ul>

然後在script標籤中插入處理分頁的代碼：

$(document).ready(function() {if($("#pagination")){var pagecount = <%= locals.pagecount %>;var pagesize = <%= locals.pagesize %>;var currentpage = <%= locals.currentpage %>;var counts,pagehtml="";if(pagecount%pagesize==0){counts = parseInt(pagecount/pagesize);}else{counts = parseInt(pagecount/pagesize)+1;}//只有一頁內容if(pagecount<=pagesize){pagehtml="";}//大於一頁內容if(pagecount>pagesize){if(currentpage>1){pagehtml+= '<li><a href="/course/index/'+(currentpage-1)+'">上一頁</a></li>';}for(var i=0;i<counts;i++){if(i>=(currentpage-3) && i<(currentpage+3)){if(i==currentpage-1){pagehtml+= '<li class="active"><a href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';}else{pagehtml+= '<li><a href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';}}}if(currentpage<counts){pagehtml+= '<li><a href="/course/index/'+(currentpage+1)+'">下一頁</a></li>';}}$("#pagination").html(pagehtml);}});

注意：locals.pagecount，locals.pagesize，locals.currentpage分別是資料庫數量，分頁大小，當前分頁，他們是從js中傳遞過來的，當然， 你也可以直接修改它們為固定的資料測試下效果。

比如：

實際效果為：

這樣一個簡單的分頁效果就出來了