思路:
1、我其实只有一个页面,每次点击上一页或者下一页的时候,我都是个超链接,超链接的url还是我本页的地址,但是在超链接之中传参数过来,这个参数就是当前的页码。
<a href="newsDetailList.jsp?pageIndex=1">首页</a>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex-1 %>">上一页</a>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex+1 %>">下一页</a>
<a href="newsDetailList.jsp?pageIndex=<%=totalPage%>">最后一页</a>
2、在知道页面容量和总数据量的前提下,我只要有当前的页码,我就知道该显示哪些信息,我就能去数据库里面把相应的数据调出来。所以每次点击换页的时候其实就是重新定义这三个数据,而页面容量是写死的,总数据量可以每次都去数据库查询,当前页码是传过来的,我都可以拿得到。
3、在上一步的过程中,因为当前页码是传过来的,但是如果是第一次访问呢?没有传当前页码过来怎么办?所以需要加一个判断,如果传过来的当前页码为空,那就赋值为1,表示这次访问我显示的是首页。
<%
// 当前页码不能写死,不然根本没法跳转
String currentPage = request.getParameter("pageIndex");
// 分页查询并显示
if (currentPage == null || currentPage.equals("")){
// 代表用户首次访问页面
currentPage = "1";
}
int pageIndex = Integer.parseInt(currentPage);
// 获取新闻总数量
int totalCount = newsService.getTotalCount();
// 每页显示几条新闻,页面容量
int pageSize = 2;
4、在上述的基础上,还有一个bug,因为每次我点击换页的时候都是超链接,而超链接里面传出去的陀值是当前代码加一或者减一,因为我并对这个数值进行判断,所以如果这个数值小于1或者大于页面总数量的时候,是不会出错的。会出现下面这种情况:
为了避免这种情况,需要对页码进行控制:
if (pageIndex < 1) {
pageIndex = 1;
} else if (pageIndex > totalPage) {
pageIndex = totalPage;
}
5、出现上述问题的原因在于明明都到了第一页了,依然还显示首页和上一页操作按钮,最后一页同理。所以这个地方可以改进一下。
<ul class="page-num-ul clearfix">
<li>共<%=totalCount %>条记录 <%=pageIndex %>/<%=totalPage %>页</li>
<%
if (pageIndex >1) {
%>
<a href="newsDetailList.jsp?pageIndex=1">首页</a>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex-1 %>">上一页</a>
<%} if (pageIndex < totalPage) {%>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex+1 %>">下一页</a>
<a href="newsDetailList.jsp?pageIndex=<%=totalPage%>">最后一页</a>
<%} %>
</ul>
代码如下:
<%@page import="cn.kgc.util.PageSupport"%>
<%@page import="cn.kgc.pojo.News"%>
<%@page import="java.util.List"%>
<%@page import="cn.kgc.Service.implement.NewsServiceImpl"%>
<%@page import="cn.kgc.Service.NewsService"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%--动态包含无法使用,页面报错,newsService无法使用 <jsp:include page="../common/common.jsp" /> --%>
<%@include file="../common/common.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>无标题文档</title>
<style type="text/css">
<!--
-->
</style>
<script>
function addNews(){
window.location="newsDetailCreateSimple.jsp";
}
</script>
</head>
<body>
<!--主体-->
<div class="main-content-right">
<!--即时新闻-->
<div class="main-text-box">
<div class="main-text-box-tbg">
<div class="main-text-box-bbg">
<form name ="searchForm" id="searchForm" action="/news/jsp/admin/newsDetailList.jsp" method="post">
<div>
新闻分类:
<select name="categoryId">
<option value="0">全部</option>
<option value='1' >国内</option>
<option value='2' >国际</option>
<option value='3' >娱乐</option>
<option value='4' >军事</option>
<option value='5' >财经</option>
<option value='6' >天气</option>
</select>
新闻标题<input type="text" name="title" id="title" value=''/>
<button type="submit" class="page-btn">GO</button>
<button type="button" onclick="addNews();" class="page-btn">增加</button>
<input type="hidden" name="currentPageNo" value="1"/>
<input type="hidden" name="pageSize" value="10"/>
<input type="hidden" name="totalPageCount" value="2"/>
</div>
</form>
<table cellpadding="1" cellspacing="1" class="admin-list">
<thead >
<tr class="admin-list-head">
<th>新闻标题</th>
<th>作者</th>
<th>时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<%
// 当前页码不能写死,不然根本没法跳转
String currentPage = request.getParameter("pageIndex");
// 分页查询并显示
if (currentPage == null || currentPage.equals("")){
// 代表用户首次访问页面
currentPage = "1";
}
int pageIndex = Integer.parseInt(currentPage);
// 获取新闻总数量
int totalCount = newsService.getTotalCount();
// 每页显示几条新闻,页面容量
int pageSize = 2;
// 获取总页数
PageSupport ps = new PageSupport();
ps.setCurrentPageNo(pageIndex);
ps.setPageSize(pageSize);
ps.setTotalCount(totalCount);
// 拿到总页数
int totalPage = ps.getTotalPageCount();
if (pageIndex < 1) {
pageIndex = 1;
} else if (pageIndex > totalPage) {
pageIndex = totalPage;
}
List<News> newsList = newsService.getPageNewsList(pageIndex, pageSize);
int i= 0;
for(News news:newsList){
i++;
%>
<tr <%if(i%2==0){ %>class="admin-list-td-h2"<%} %>>
<td><a href='newsDetailView.jsp?id=<%=news.getId()%>'><%=news.getTitle() %></a></td>
<td><%=news.getAuthor() %></td>
<td><%=news.getCreateDate() %></td>
<td><a href='adminNewsCreate.jsp?id=2'>修改</a>
<a href="javascript:if(confirm('确认是否删除此新闻?')) location='adminNewsDel.jsp?id=2'">删除</a>
</td>
</tr>
<%} %>
</tbody>
</table>
<div class="page-bar">
<ul class="page-num-ul clearfix">
<li>共<%=totalCount %>条记录 <%=pageIndex %>/<%=totalPage %>页</li>
<%
if (pageIndex >1) {
%>
<a href="newsDetailList.jsp?pageIndex=1">首页</a>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex-1 %>">上一页</a>
<%} if (pageIndex < totalPage) {%>
<a href="newsDetailList.jsp?pageIndex=<%=pageIndex+1 %>">下一页</a>
<a href="newsDetailList.jsp?pageIndex=<%=totalPage%>">最后一页</a>
<%} %>
</ul>
<span class="page-go-form"><label>跳转至</label>
<input type="text" name="inputPage" id="inputPage" class="page-key" />页
<button type="button" class="page-btn" onClick='jump_to(document.forms[0],document.getElementById("inputPage").value)'>GO</button>
</span>
</div>
</div>
</div>
</div>
</div>
</body></html>