JavaWeb&jsp网页分页的实现
方法一:一次性将数据都查询到存放到cookie中
只需查询一次数据库
该方法只查询一次数据库,然后利用前端将查到的内容放到网页上,需要前端验证过滤掉多余的数据,该方法的缺点是用户第一次进入网页时,若数据量过大,可能造成用户等待时间过久。
1.发送请求部分
<%request.getSession().setAttribute("begin",0); %>
<%request.getSession().setAttribute("page", 1); %>
<script>
var flag1;
var flag2;
$.ajaxSettings.async = false;
$.post("/blog/typeServlet",{
op:'getAllType'
},function( data ){
flag1 = data;
});
$.post("/blog/contentsServlet",{
op:'getAllContent'
},function( data ){
flag2 = data;
});
$.ajaxSettings.async = true;
if( flag1>0 && flag2>0 ){
location.href="main.jsp"
}else{
location.href="error.html"
}
</script>
2.查询数据
public List<Type> getTypeInfo() {
String sql = "select * from type order by tid";
List<Type> list = db.find(sql,null,Type.class);
return list;
}
3.1 servlet部分
private void getAllContent(HttpServletRequest req, HttpServletResponse resp, PrintWriter out) {
List<Map<String, String>> list = cb.getAllContent();
req.getSession().setAttribute("contents", list);
req.getSession().setAttribute("pages", list.size()%5==0 ? list.size()/5 : list.size()/5+1 );
req.getSession().setAttribute("counts", list.size());
out.print( list.size() );
}
3.2 servlet控制每页展示条数,页数
private void getContentByPage(HttpServletRequest req, HttpServletResponse resp, PrintWriter out) {
String change =req.getParameter("change") ;
Integer begin =(Integer) req.getSession().getAttribute("begin");
Integer pages = (Integer) req.getSession().getAttribute("pages");
Integer counts = (Integer) req.getSession().getAttribute("counts");
Integer page = (Integer) req.getSession().getAttribute("page");
if( "1".equals(change) ) {
begin += 5;
page++;
}else {
begin -= 5;
page--;
}
begin = Math.max(1, Math.min(begin, counts-5));
page = Math.max(1, Math.min(page, pages));
//System.out.println(page+"-"+pages);
//System.out.println(begin);
req.getSession().setAttribute("page", page);
req.getSession().setAttribute("begin", begin);
out.print( begin );
}
4.前端网页循环显示数据及页数显示:
<c:forEach var="content" items="${contents }" begin="${begin }" end="${begin+5 }" varStatus="status">
<div class="listBox">
<h1>${content.title }</h1>
<p class="colDefault">
作者:<span class="colInfo">${content.uname }</span> - 时间:<span class="colInfo">${content.addtime }</span>
- 阅读:<span class="colInfo">${content.views }</span> - 评论:<span class="colInfo">0</span>
</p>
<dfn>
<p>${content.discription }</p>
</dfn>
<div class="function">
<a href="">阅读全文</a>
</div>
</div>
</c:forEach>
<div class="pager">
<ul class="clear">
<li class="previous"><a href="javascript:void(0);" onclick="changePage(-1);">上一页</a></li>
<li><strong> ${page } / ${pages } </strong></li>
<li class="next"><a href="javascript:void(0);" onclick="changePage(1);">下一页</a></li>
</ul>
</div>
方法二:java后台多次连接查询数据库分页
一次需要多少数据就查多少数据
该方法需要多次查询数据库,然后将每次查到的内容放到网页上,无需前端验证过滤不需要的数据。每次查出用户所需数据,首次进入网页时,用户不必等待过久的时间。
1.前端网页显示
<div class="container-fluid">
<div class="jumbotron">
<h3>用户列表</h3>
<table class="table table-striped table-hover">
<tr>
<th style="text-align: center;">ID</th>
<th style="text-align: center;">用户名</th>
<th style="text-align: center;">密码</th>
<th style="text-align: center;">是否为管理员</th>
</tr>
<c:forEach var="myuser" items="${users }" varStatus="status">
<tr align="center">
<td>${myuser.uid }</td>
<td>${myuser.uname }</td>
<td>${myuser.pwd }</td>
<c:if test="${myuser.isadmin==0 }">
<td>否</td>
</c:if>
<c:if test="${myuser.isadmin==1 }">
<td>是</td>
</c:if>
</tr>
</c:forEach>
</table>
</div>
</div>
2.js发送请求
function changePage( page ){
$.post("../userServlet",{
op:'getAllUser',
page:page, //默认第一页
size:'7' //每页7条数据
},function( data ){
if( data>0 ){
location.href = "users.jsp";
}else{
alert("网络错误!");
}
});
}
3.后台数据库查询
public List<User> getAllUserByPage(int page, int size) {
String sql = "select * from user order by uid limit "+(page-1)*size+","+size;
return db.find(sql, null, User.class);
}