JSP分页问题 - 物是人非CJT

JSP分页问题

在很多的应用中几乎都能看到分页的应用，如腾讯qq空间的留言板，bbs论坛，以及淘宝的商品展示等。

分页是为了便于更方便的查看数据，并能跳转到指定的页面。下面是一个例子：

这个分页显示能跳转到指定的页面，并且提示当前所在页，这个页面是servlet的一个应用，

我们在做分页的时候，只要记住，每次跳转到一个页面时，都要向servlet发送要跳转到的页码，以便于后台可以对页码进行分析计算，保证前台页面页码的正确性。

要判断是否能进行跳转：当前页码不是最后一页时，可以跳转，否则不可跳转。

<c:if test="${pageNo<totalPages}">

</c:if>

<c:if test="${pageNo>=totalPages}">

</c:if>

当要跳转到上一页是，要判断如果当前页码不是第一页，可以跳转，否则不可跳转。

<c:if test="${pageNo>1}">

</c:if>

<c:if test="${pageNo<=1}">

</c:if>

中间显示的页码，可以跳转到指定页。通过判断该链接指向的页码和当前页相同则加样式突出显示，以便用户知道当前所在页。

<c:forEach items="${pages}" var="page">

<c:choose>

<c:when test="${page==pageNo}">

</c:when>

<c:otherwise>

</c:otherwise>

</c:choose>

</c:forEach>

<c:if test="${pageNo<totalPages}">

</c:if>

下面给出服务器端的代码：

//分页查询

if (path.equals("/list")) {

int pageNo = 0;

if (request.getParameter("pageNo") == null) {

pageNo = 1;

System.out.println("空！！！！！！");

} else {

pageNo = Integer.parseInt(request.getParameter("pageNo"));

}

System.out.println("当前正在查询第" + pageNo + "页");

List<Book> books = bs.FindByPage(pageNo, 2);

int totalPages = bs.findTotalPages(2);

List<Integer> pages = new ArrayList<Integer>();

// 每页显示几个页码

//对本例来讲，页面显示4个跳转码，那么当请求页面小于4时，要将1、2、3、4、

//全部显示出来，

int pageSize = 4;

if (pageNo < pageSize) {

for (int i = 1; i <= pageSize; i++) {

pages.add(i);

}

//当点击4是，后面要出现5的跳转链接，所以要从当前页面前两个开始，到它的、、//后一个页面结束。

else if (pageNo < totalPages) {

for (int i = pageNo - pageSize + 2; i <= pageNo + 1

&& pageNo < totalPages; i++) {

pages.add(i);

}

} else {

for (int i = totalPages - pageSize + 1; i <= totalPages; i++) {

pages.add(i);

}

request.setAttribute("books", books);

// 测试页数

request.setAttribute("pages", pages);

request.setAttribute("totalPages", totalPages);

request.setAttribute("pageNo", pageNo);

request.getRequestDispatcher("list.jsp").forward(request, response);

}

页面显示代码：

<%@ page language="java" contentType="text/html; charset=utf-8"

pageEncoding="utf-8"%>

<%@ page import="java.util.*"%>

<%@ page import="com.tarena.vo.Book"%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

content="text/html; charset=ISO-8859-1">

<title>所有图书信息</title>

</script>

function change(value){

$(value).hover(

function () {

$(this).children(".second").addClass("mouseon");

$(this).children(".first").addClass("firstimage");

function () {

$(this).children(".second").removeClass("mouseon");

}

);

}

</script>

.hover{

height:400px;

}

.second{

z-index:2;

display:none;

border:1px solid red;

}

.mouseon{

display:block;

}

.firstimage{

display:none;

}

.currentPage{

font-weight:bold;

color:#ff9a00;

text-decoration: none;

border:1px solid blue;

padding:8px;

}

.toPageNo{

width:15px;

text-align:center;

}

.toPageNo:hover {

border:1px solid red;

}

.page{

padding:6px;

border:1px solid blue;

background-color:#ffad11;

text-decoration: none;

font-weight: bold;

}

.page:hover{

font-size:20px;

}

.goto:hover{

font-size:20px;

}

.end{

padding: 10px;border:1px solid blue;

text-decoration: none;

color:silver;

}

#pageDivide{

margin-top: 40px;

}

</style>

</head>

<body>

<tr>

</td>

</tr>

<c:forEach var="book" items="${books}" varStatus="status">

<c:if test="${stauts.index%3==10}">

<tr>

</c:if>

<td>

<a style="text-decoration: none"

href="bookInfo.do?isbn=${book.isbn}">${book.title},第${book.edtionNumber}版</a>

</div>

<a style="text-decoration: none"

href="bookInfo.do?isbn=${book.isbn}&pageNo=${pageNo}"><img class="first"

src="BookImages/${book.imageFile}" height="120" width="150" />

</a>

</div>

</td>

<c:if test="${status.index%3==2}">

</tr>

</c:if>

</c:forEach>

</table>

<c:if test="${pageNo>1}">

</c:if>

<c:if test="${pageNo<=1}">

</c:if>

<c:forEach items="${pages}" var="page">

<c:choose>

<c:when test="${page==pageNo}">

</c:when>

<c:otherwise>

</c:otherwise>

</c:choose>

</c:forEach>

<c:if test="${pageNo<totalPages}">

</c:if>

<c:if test="${pageNo>=totalPages}">

</c:if>

第<span style="color:red;font-size:20px;"><input class="toPageNo" value="${pageNo}"/></span>页,共<span style="color:red;font-size:20px;">${totalPages}</span>页

</div>

</body>

</html>

posted on 2013-10-23 11:00 物是人非CJT 阅读(344) 评论(0) 收藏举报