Thymeleaf+bootstrap实现简单分页

做项目时候，想找一个简单的分页代码，懒得用前端框架和json，没找到，就自己写了一份简单的

需要从后台传两个变量：

indexPage（当前页数）

totalPage（一共页数）

效果图如下：

 

总体思路是以当前页为中心，左边三个按钮右边三个按钮，挨个判断+页数和-页数时有没有超出范围

在第一页和最后一页时需要做一个判断，如果当前页等于1时，上一页按钮失效，当前页等于总页数时，最后一页失效

最后上代码：

模板代码基于Bootstrap

<ul class="pagination pagination-lg" >
    <li th:class="${indexPage==1}?'disabled' : ''"><a href="#">上一页</a></li>
    <li th:if="${indexPage-3 >=1}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage-3}}" th:text="${indexPage -3}" >1</a></li>
    <li th:if="${indexPage-2 >=1}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage-2}}" th:text="${indexPage -2}" >1</a></li>
    <li th:if="${indexPage-1 >=1}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage-1}}" th:text="${indexPage -1}" >1</a></li>
    <li class="active"><a href="#" th:text="${indexPage}" >1</a></li>
    <li th:if="${indexPage+1 <=totalPage}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage+1}}" th:text="${indexPage +1}" >1</a></li>
    <li th:if="${indexPage+2 <=totalPage}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage+2}}" th:text="${indexPage +2}" >1</a></li>
    <li th:if="${indexPage+3 <=totalPage}" ><a th:href="@{'admin_law_list.html?page=' + ${indexPage+3}}" th:text="${indexPage +3}" >1</a></li>

    <li th:class="${indexPage==totalPage}?'disabled' : ''" ><a href="#">下一页</a></li>
</ul><br>
————————————————
版权声明：本文为CSDN博主「白学家Lynn」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/lynn_coder/article/details/79919638

后台传当前页和总页数

 

 

 

转载:https://blog.csdn.net/lynn_coder/article/details/79919638