BookStore/web/pages/common/page_nav.jsp

<%--
  Created by IntelliJ IDEA.
  User: jhu
  Date: 2020/10/5
  Time: 16:15
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<div id="page_nav">
    <!-- 首页链接 -->
    <a href="${requestScope.page.url}&pageNo=1">首页</a>

    <!-- 上一页链接 -->
    <c:if test="${requestScope.page.pageNo > 1}">
        <a href="${requestScope.page.url}&pageNo=${requestScope.page.pageNo - 1}">上一页</a>
    </c:if>

    <!-- 分页逻辑 -->
    <c:choose>
        <%-- 当总页码小于等于5的情况 --%>
        <c:when test="${requestScope.page.pageTotal <= 5}">
            <c:set var="begin" value="1"></c:set>
            <c:set var="end" value="${requestScope.page.pageTotal}"></c:set>
        </c:when>
        <c:otherwise>
            <%-- 当总页码大于5的情况 --%>
            <c:choose>
                <%-- 当前页码是前三 --%>
                <c:when test="${requestScope.page.pageNo <= 3}">
                    <c:set var="begin" value="1"></c:set>
                    <c:set var="end" value="5"></c:set>
                </c:when>
                <%-- 当前页码是后三 --%>
                <c:when test="${requestScope.page.pageNo >= requestScope.page.pageTotal - 2}">
                    <c:set var="begin" value="${requestScope.page.pageTotal - 4}"></c:set>
                    <c:set var="end" value="${requestScope.page.pageTotal}"></c:set>
                </c:when>
                <c:otherwise>
                    <%-- 当前页码在中间 --%>
                    <c:set var="begin" value="${requestScope.page.pageNo - 2}"></c:set>
                    <c:set var="end" value="${requestScope.page.pageNo + 2}"></c:set>
                </c:otherwise>
            </c:choose>
        </c:otherwise>
    </c:choose>

    <!-- 显示页码 -->
    <c:forEach begin="${begin}" end="${end}" var="i">
        <c:if test="${i == requestScope.page.pageNo}">【${i}】</c:if>
        <c:if test="${i != requestScope.page.pageNo}">
            <a href="${requestScope.page.url}&pageNo=${i}">${i}</a>
        </c:if>
    </c:forEach>

    <!-- 下一页链接 -->
    <c:if test="${requestScope.page.pageNo < requestScope.page.pageTotal}">
        <a href="${requestScope.page.url}&pageNo=${requestScope.page.pageNo + 1}">下一页</a>
    </c:if>

    <!-- 末页链接 -->
    <a href="${requestScope.page.url}&pageNo=${requestScope.page.pageTotal}">末页</a>

    <!-- 显示总页数和总记录数 -->
    共${requestScope.page.pageTotal}页，${requestScope.page.pageTotalCount}条记录

    <!-- 跳转页码输入框 -->
    到第<input value="${param.pageNo}" name="pn" id="pn_input"/>页
    <input id="searchPageBtn" type="button" value="确定">

    <!-- 跳转页码的JavaScript脚本 -->
    <script type="text/javascript">
        $(function () {
            // 点击“确定”按钮时触发跳转
            $("#searchPageBtn").click(function () {
                // 获取用户输入的页码
                var pageNo = $("#pn_input").val();
                // 获取总页数
                var pageTotal = ${requestScope.page.pageTotal};

                // 校验页码范围
                if (pageNo < 1) pageNo = 1;
                if (pageNo > pageTotal) pageNo = pageTotal;

                // 跳转到指定页码
                location.href = "${requestScope.basePath}${requestScope.page.url}&pageNo=" + pageNo;
            });
        });
    </script>
</div>