package com.zxkj.bean; import java.util.List; public class PageBean<T> { //当前页显示的数据 private List<T> records; //当前页码 private long pageNum; //总页码 private long totalPageNum; //每页显示的记录条数 private long pageSize = GlobalConst.PAGE_SIZE; //总记录条数 private long totalRecordsNum; //上一页 private long prePageNum; //下一页 private long nextPageNum; //自定义值 private Object object; //查询分页的请求的地址(通过这个属性可以将页面中的分页部分给抽取成公共部分) private String url; public List<T> getRecords() { return records; } public void setRecords(List<T> records) { this.records = records; } public long getPageNum() { return pageNum; } public void setPageNum(long pageNum) { this.pageNum = pageNum; } public long getTotalPageNum() { return totalPageNum; } public void setTotalPageNum(long totalPageNum) { this.totalPageNum = totalPageNum; } public Object getObject() { return object; } public void setObject(Object object) { this.object = object; } public long getPrePageNum() { prePageNum = pageNum - 1; if (prePageNum < 1) { prePageNum = 1; } return prePageNum; } public long getNextPageNum() { nextPageNum = pageNum + 1; if (nextPageNum > totalPageNum) { nextPageNum = totalPageNum; } return nextPageNum; } public long getPageSize() { return pageSize; } public void setPageSize(long pageSize) { this.pageSize = pageSize; } public long getTotalRecordsNum() { return totalRecordsNum; } public void setTotalRecordsNum(long totalRecordsNum) { this.totalRecordsNum = totalRecordsNum; } public String getUrl() { return url; } public void setUrl(String url) { this.url = url; } @Override public String toString() { StringBuffer sb = new StringBuffer(); for (T t : records) { sb.append(t).append("\n"); } return "PageBean{\n" + "pageNum=" + pageNum + ", totalPageNum=" + totalPageNum + ", pageSize=" + pageSize + ", totalRecordsNum=" + totalRecordsNum + ", prePageNum=" + prePageNum + ", nextPageNum=" + nextPageNum + ", url='" + url + '\'' + ",\n" + ", object='" + object.toString() + "records=" + sb + '}'; } }
前端分页导航条:html+thymeleaf
<!--分页--> <div class="btn-group btn-group-page" id="btn-group-page" style="position: fixed;bottom: 0px;bottom: 5px;left: 476px;" th:if="${pageBean != null && pageBean.records.size() ne 0}"> <!-- 上一页--> <a th:class="${pageBean.pageNum==1?'btn btn-default radius':'btn btn-primary radius'}" th:href="${pageBean.url}+${pageBean.prePageNum}"><i class="Hui-iconfont"></i></a> <!-- 页码--> <a th:class="${pageBean.pageNum==i?'btn btn-secondary radius':'btn btn-default radius'}" th:href="${pageBean.url}+${i}" th:each="i: ${#numbers.sequence(__${pageBean.object[0]}__,__${pageBean.object[1]}__)}" th:text="${i}"></a> <!-- ...--> <a class="btn btn-default radius" th:href="${pageBean.url}+${pageBean.nextPageNum}" th:if="${pageBean.object[1]!=pageBean.totalPageNum}"><i class="Hui-iconfont"></i></a> <!-- 总页码--> <a class="btn btn-default radius" th:href="${pageBean.url}+${pageBean.totalPageNum}" th:if="${pageBean.object[1]!=pageBean.totalPageNum}" th:text="${pageBean.totalPageNum}"></a> <!-- 下一页--> <a th:class="${pageBean.pageNum<pageBean.totalPageNum?'btn btn-primary radius':'btn btn-default radius'}" th:href="${pageBean.url}+${pageBean.nextPageNum}"><i class="Hui-iconfont"></i></a> </div> <!--以上可抽离出页面,用下面这段引用--> <div style="float: right" th:include="common/_page.html"></div>
如果需要动态居中可以使用以下js代码(不推荐使用):
// 分页导航条居中 function pageCenter() { var page = document.getElementById("btn-group-page"); //获取元素自身的宽度 var L1 = page.offsetWidth; //获取实际页面的left值。(页面宽度减去元素自身宽度/2) var Left = (document.documentElement.clientWidth - L1) / 2; page.style.left = Left + 'px'; } window.onresize = function () { pageCenter(); }