前台的页码怎么控制在1到总页数之间？
来源：5-2 项目作业
视线模糊
2021-01-07 07:16:19
数据只有7条，每页显示3条，但是点击上一页，下一页会出现超范围的现象
package com.imooc.ibook.controller;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.imooc.ibook.biz.BookBiz;
import com.imooc.ibook.biz.CategoryBiz;
import com.imooc.ibook.biz.impl.BookBizImpl;
import com.imooc.ibook.biz.impl.CategoryBizImpl;
import com.imooc.ibook.entity.Book;
import com.imooc.ibook.entity.Category;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;
public class DefaultController {
private CategoryBiz categoryBiz = new CategoryBizImpl();
private BookBiz bookBiz = new BookBizImpl();
//list.do获取所有的图书的数据
public void list(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<Category> categoryList = categoryBiz.selectAll();
String pageNum = request.getParameter("pageNum");
if (pageNum == null) {
pageNum = "1";
}
PageHelper.startPage(Integer.parseInt(pageNum), 3);
List<Book> list = bookBiz.findAll();
PageInfo pageInfo = PageInfo.of(list);
request.setAttribute("pageInfo",pageInfo);
request.getServletContext().setAttribute("categoryList", categoryList);
request.getRequestDispatcher("/front/index.jsp").forward(request, response);
}
}
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="keywords" content=""/>
<!-- //Custom Theme files -->
<link href="css/bootstrap.css" type="text/css" rel="stylesheet" media="all">
<link href="css/style.css" type="text/css" rel="stylesheet" media="all">
<!-- js -->
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap-3.1.1.min.js"></script>
<!-- //js -->
<!-- cart -->
<script src="js/simpleCart.min.js"></script>
<!-- cart -->
<script type="text/javascript">
</script>
</head>
<body>
<!--header-->
<div class="header">
<div class="container">
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h1 class="navbar-brand"><a href="">IMOOC</a></h1>
</div>
<!--navbar-header-->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/list.do" class="active">首页</a></li>
<!-- 此处分类应从数据库中读取 -->
<c:forEach items="${categoryList}" var="category">
<li class="dropdown">
<a href="">${category.name}</a>
</li>
</c:forEach>
<%-- <li class="dropdown">--%>
<%-- <a href="">Java</a>--%>
<%-- </li>--%>
<%-- <li class="dropdown">--%>
<%-- <a href="">前端</a>--%>
<%-- </li>--%>
</ul>
</div>
</nav>
</div>
<div class="clearfix"></div>
</div>
</div>
<!--//header-->
<!--banner-->
<div class="banner">
<div class="container" style="height: 300px">
<h2 class="hdng">IMOOC <span>图书</span></h2>
<p>读万卷书，行万里路</p>
<a href="#">SHOP NOW</a>
<!--
<div class="banner-text">
<img src="../../../images/tushu.jpeg" alt=""/>
</div>
-->
</div>
</div>
<!--//banner-->
<!--gallery-->
<div class="gallery">
<div class="container">
<div class="gallery-grids">
<c:forEach items="${pageInfo.list}" var="book">
<div class="col-md-3 gallery-grid " style="float:left">
<a href="#">
<img src="${book.imgPath}" class="img-responsive" alt=""/>
<div class="gallery-info">
<p><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span> view</p>
<a class="shop" href="/detail.do?id=${book.id}">SHOP NOW</a>
<div class="clearfix"></div>
</div>
</a>
<div class="galy-info">
<p style="size: 30px">${book.name}</p>
<div class="galry">
<div class="prices">
<h5 class="item_price">￥${book.price}</h5>
</div>
<div class="rating">
<c:forEach begin="1" end="${book.level}" var="i">
<span>☆</span>
</c:forEach>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</c:forEach>
</div>
<div align="right">
<!-- 分页部分可以参照MyBatis拦截器的例子-->
<div class="col-md-12 gallery-grid glry-two text-right">
<a href="/list.do?pageNum=1" style="color:#666666;"><span class="glyphicon glyphicon-backward"></span></a>
<a href="/list.do?pageNum=${pageInfo.pageNum-1}" style="color:#666666;"><span class="glyphicon glyphicon-chevron-left"></span></a>
共${pageInfo.total}条 ${pageInfo.pageNum}/${pageInfo.pages}
<a href="/list.do?pageNum=${pageInfo.pageNum+1}" style="color:#666666;"><span class="glyphicon glyphicon-chevron-right"></span></a>
<a href="/list.do?pageNum=${pageInfo.pages}" style="color:#666666;"><span class="glyphicon glyphicon-forward"></span></a>
</div>
<%-- <div class="page">--%>
<%-- <div class="container">--%>
<%-- <ul>--%>
<%-- <li><a href="">首页</a></li>--%>
<%-- <li><a href="">上一页</a></li>--%>
<%-- <li><a href="">当前第1页</a></li>--%>
<%-- <li><a href="">下一页</a></li>--%>
<%-- <li><a href="">尾页</a></li>--%>
<%-- </ul>--%>
<%-- </div>--%>
</div>
</div>
</div>
</div>
<!--//gallery-->
<!--subscribe-->
<!--//subscribe-->
<!--footer-->
<!--//footer-->
<div class="footer-bottom">
<div class="container">
<p>Copyright © 2017 imooc.com All Rights Reserved | 京ICP备 13046642号-2</p>
</div>
</div>
</body>
</html>
写回答
1回答
-
好帮手慕小脸
2021-01-07
同学你好，
1、控制页码在1到总页数之间用如下代码即可：
${pageInfo.pageNum}/${pageInfo.pages}2、经拼接测试上述贴出的代码是可以正确获取页数以及正确跳转上—页，下一页的，建议同学查看浏览器控
制台以及idea控制台是否出现报错，如果有，将错误信息贴出便于老师定位问题
祝学习愉快~
0
相似问题
页码显示超出数据总数以及负数
回答 1
首页页面商品推荐怎么有一片空白
回答 2