javaweb分页思想

web上的分页分析

在web编写中的经常会遇到，数据需要分页的情况。当数据量不是很大的时候。

可以直接使用js来分页。可以很好的提高性能。简化代码。数据量大的时候。还是需要使用java的分页类还处理。

今天我来分析下。分页中导航的显示效果的实现。

显示效果：

[页面总数小于等于10，全部显示，当前页特殊显示]

上一页 1 2 3 4 5 6 7 8 9 10 下一页

[页面总数大于10，部分显示，当前页特殊显示]

上一页 1 2 3 … 20 下一页 [当前页面为首页时，上一页不可用]

上一页 1 2 3 4 5 … 20 下一页

上一页 1 2 3 4 5 6 … 20 下一页

上一页 1 … 3 4 5 6 7 … 20 下一页

上一页 1 … 14 15 16 17 18 ... 20 下一页

上一页 1 … 15 16 17 18 19 20 下一页

上一页 1 … 16 17 18 19 20 下一页

上一页 1 … 17 18 19 20 下一页

上一页 1 … 18 19 20 下一页[当前页面为末页时，下一页不可用]

算法提取：

0.页码显示规则：

当前页为首页时不显示上一页；上一页 1 2 3 … 20 下一页

当前页为尾页时不显示下一页；上一页 1 … 17 18 19 20 下一页

1.页面总数(n)<=10 {

显示全部页码：上一页 1 2 3 4 5 6 7 8 9 10 下一页

}

2.页面总数(n) > 10 {

2.1 当前页码 <= 4 {

左侧显示所有 + 当前页码 + 右侧2个页码 + ... + 尾页

上一页 1 2 3 4 5 … 20 下一页

上一页 1 2 3 4 5 6 … 20 下一页

}

2.2 当前页码 > 4 且<= 页面总数(n) - 3 {

首页 + ... + 左侧2个页码 + 当前页码 + 右侧2个页码 + ... + 尾页

上一页 1 … 3 4 5 6 7 … 20 下一页

上一页 1 … 14 15 16 17 18 ... 20 下一页

}

2.3 当前页码 > 页面总数(n) - 3 {

首页 + ... + 左侧2个页面 + 当前页码 + 右侧显示所有

上一页 1 … 15 16 17 18 19 20 下一页

上一页 1 … 16 17 18 19 20 下一页

上一页 1 … 17 18 19 20 下一页

}

下面我来把他修改成java语言。

[java]

public class PageTest {

public static String pageControl(int page,int count){

String strHtml = "";

if(page > 1){

strHtml += "上一页";

}

if(count <= 10){

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

if(page == i){

strHtml+=" ["+i+"]";

}else{

strHtml+=" "+i;

}

}else{

if(page<4){

for(int i = page-1;i>0;i--){

strHtml+=" "+i;

}

strHtml+=" ["+page+"]";

strHtml+=" "+(page+1);

strHtml+=" "+(page+2);

strHtml+=" ...";

strHtml+=" "+count;

}

if(page>4 && (page<=count-3)){

strHtml+=" "+1;

strHtml+=" ...";

strHtml+=" "+(page-2);

strHtml+=" "+(page-1);

strHtml+=" ["+page+"]";

strHtml+=" "+(page+1);

strHtml+=" "+(page+2);

strHtml+=" ...";

strHtml+=" "+count;

}

if(page>count-3){

strHtml+=" "+1;

strHtml+=" ...";

strHtml+=" "+(page-2);

strHtml+=" "+(page-1);

strHtml+=" ["+page+"]";

for(int i = page+1;i<count;i++){

strHtml+=" "+i;

}

if(page < count){

strHtml += "下一页";

}

return strHtml;

}

public static void main(String[] args) {

System.out.println(PageTest.pageControl(6, 20));

}

[/java]

这个是分页导航的效果。需要对应的效果。可以自行修改。

写成js:

<%@ page language="java" pageEncoding="UTF-8" %>

if (totalPages <= displayNum) {
startPage = 1;
endPage = totalPages;
}/* else if (pageNumber <= (displayNum - 1) / 2) {
startPage = 1;
endPage = displayNum;
} else if (pageNumber >= totalPages - (displayNum - 1) / 2) {
startPage = totalPages - displayNum + 1;
endPage = totalPages;
} else {
startPage = pageNumber - (displayNum - 1) / 2;
endPage = pageNumber + (displayNum - 1) / 2;
} */
if(totalPages<=10){
if(totalPages==1||totalPages==0){

sbPageString = "<a href='javascript:void(0)' onclick='toPage("+1+")' style='background-color:#EFCFB6;'>" + 1 + "</a>";
}else{
sbPageString += "<a href='javascript:void(0)' class='first-child' onclick='toPage("+(pageNumber -1)+")' >上一页 </a>";
for(var i=1;i<=totalPages;i++){
if(i<pageNumber){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+i+")'>" + i + "</a>";
}else if(i==pageNumber){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber)+")' style='background-color:#EFCFB6;'>" + pageNumber + "</a>";
}else if(i>pageNumber){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+i+")'>" + i + "</a>";
}
}
sbPageString += "<a href='javascript:void(0)' class='first-child' onclick='toPage("+(pageNumber +1)+")'>下一页 </a>";
}
}
if(totalPages>10){
if(pageNumber!=1){
sbPageString += "<a href='javascript:void(0)' class='first-child' onclick='toPage("+(pageNumber -1)+")' >上一页 </a>";
}
if(pageNumber<=4){
for(var i=1;i<=parseInt(pageNumber);i++){
if(i!=pageNumber){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+i+")' >" + i + "</a>";}
if(i==pageNumber){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber)+")' style='background-color:#EFCFB6;'>" + pageNumber + "</a>";
}
}
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber+1)+")'>" + (pageNumber+1) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber+2)+")'>" + (pageNumber+2) + "</a>...";

sbPageString += "<a href='javascript:void(0)' onclick='toPage("+totalPages+")'>" + totalPages + "</a>";

}
if(pageNumber>4&&pageNumber<=totalPages-3){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+1+")'>" + 1 + "</a>...";

sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber-2)+")'>" + (pageNumber-2) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber-1)+")'>" + (pageNumber-1) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+pageNumber+")' style='background-color:#EFCFB6;'>" + pageNumber + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber+1)+")'>" + (pageNumber+1) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber+2)+")'>" + (pageNumber+2) + "</a>...";

sbPageString += "<a href='javascript:void(0)' onclick='toPage("+totalPages+")'>" + totalPages + "</a>";
}
if(pageNumber>totalPages-3){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+1+")'>" + 1 + "</a>...";

sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber-2)+")'>" + (pageNumber-2) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+(pageNumber-1)+")'>" + (pageNumber-1) + "</a>";
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+pageNumber+")' style='background-color:#EFCFB6;'>" + pageNumber + "</a>";
for(var i=pageNumber+1;i<=totalPages;i++){
sbPageString += "<a href='javascript:void(0)' onclick='toPage("+i+")'>" + i + "</a>";
}
}
if(parseInt(pageNumber)!=totalPages){
sbPageString += "<a href='javascript:void(0)' class='first-child' onclick='toPage("+(pageNumber +1)+")' >下一页 </a>";
}
}

$(".yema").append(sbPageString);
</script>

javaweb分页思想的更多相关文章

ASP.NET MVC 数据分页思想及解决方案代码
作为一个程序猿,数据分页是每个人都会遇到的问题.解决方案更是琳琅满目,花样百出.但基本的思想都是差不多的. 下面给大家分享一个简单的分页器,让初学者了解一下最简单的分页思想,以及在ASP.NET MV ...
javaweb分页查询实现
Javaweb分页技术实现分页技术就是通过SQL语句(如下)来获取数据,具体实现看下面代码 //分页查询语句 select * from 表名 where limit page , count; 和 ...
Android 仿淘宝头条竖直跑马灯式新闻标题及“分页思想
在淘宝App的首页中间位置,有一块小小的地方在不知疲倦地循坏滚动着头条标题(见下图的红框区域),这样的设计无疑能够在有限的手机屏幕上展示更丰富的内容.而实现这一功能需要用到的控件就是我在上一篇文章中提 ...
crm 数据展示和分页思想(一)
1. 数据的展示数据通过ORM查询出来对象列表 QuerySet 1. 普通的字段对象.字段名 ——> 数据库中的值 <td>{{ customer.phone }}</ ...
住javaWeb分页实现（模拟百度首页）
本文来源于 http://blog.csdn.net/tjpu_lin/article/details/41050475 近期在开发一个项目,项目中有非常多数据展示的模块.所以要用到分页,网上搜了非常 ...
Javaweb分页功能简单实现
效果如下图数据库中的数据页面效果首先,创建一个通用类Page,代码及 ...
JavaWeb分页显示内容之分页查询的三种思路(数据库分页查询)
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6134851.html 在开发过程中,经常做的一件事,也是最基本的事,就是从数据库中查询数据,然后在客户端显示出 ...
javaweb分页的后端实现
先上demo图 servlet实现部分: package servlet; import java.io.IOException; import java.util.List; import java ...
ASP.NET MVC 简单的分页思想与实现
首先我们通过VS创建一个空的基于Razor视图引擎的ASP.NET MVC3 Web应用程序,命名为JohnConnor.Web 对创建过程或Razor不太了解的看官,请移步 ASP.NET MVC ...

随机推荐

很强的PHP图片处理类
/*** 基本图片处理,用于完成图片缩入,水印添加* 当水印图超过目标图片尺寸时,水印图能自动适应目标图片而缩小* 水印图可以设置跟背景的合并度** Copyright(c) 2005 by ustb ...
http head
Accept HTTP_ACCEPT Accept-Charset HTTP_ACCEPT-CHARSET Accept-Encoding HTTP_ACCEPT-ENCODING Accept-La ...
WPF中TextBox限制输入不起作用的问题
最近再用textbox做限制输入时遇到一个莫名其妙的问题: 首先看代码: <TextBox Name="txtip1" Height="40" Widt ...
shell编程技术之-基础知识
一.脚本结构 linux下shell的脚本,是将一系列命令序列写在一个文本文件,而这个文本文件时可执行的.相对命令行来说,开发效率提高.因此他的构架有2部分构成#!和命令序列.其中#!指明此脚本是用哪 ...
NGINX和PHP之间的环境变量传递
昨天遇到的,想将IP访问转换成域名访问.则NGINX需要将相关的变量转换后传递给PHP. 网上有一系统的方法: 前面讲过该不该把信息写在服务器配置文件里?.通过php扩展hidef来define常量, ...
protel或Altium Designer中各种栅格（grid）的意义
Snap Grid:捕获栅格.指光标移动的最小间隔.Component Grid:元件放置捕获栅格.指放置元件时,元件移动的间隔.Electrical Grid:电气栅格.电气栅格的作用是在移动或放置 ...
library cache: mutex X
我们先来看看 library cache: mutex X . 是个什么东西 The library cache mutex is acquired for similar purposes that ...
如何查找到文件以后，带目录一起拷贝到新的目录？ cp --parents source destination
如何查找到文件以后,带目录一起拷贝到新的目录? cp --parents source destination
js深入研究之自定义混合Mixin函数
<script type="text/javascript"> /* 增加函数 */ function augment(receivingClass, givingCl ...
HDU5044---Tree 树链剖分
大致题意:add1 u v u到v路径上所有点的权值加上k,add2 u 到v路径上所有边的权值加上k 最后输出所有点的权值,边的权值..树链剖分预处理然后来个线性O(n)的操作.刚开始用线段树 ...

javaweb分页思想

javaweb分页思想的更多相关文章

随机推荐

热门专题