java web js完美分页 前后台要结合!个人原版封装
js
/**分页***/
//init
function pageFn(_url,_param)
{
//init
sendReq(_url,_param);
//首页
// $("#_firstPage").click(function(){
// var param=getParam();
// param.mPageIndex=1;
// sendReq(_url,param);
// });
//尾页
// $("#_lastPage").click(function(){
//
// var param=getParam();
// var lastPageVar= $("#_sizePage").html();
// param.mPageIndex=parseInt(lastPageVar,10);
// sendReq(_url,param);
// });
//上一页
// $("#_pageUp").click(function(){
//
// var param=getParam();
// var currentPageVar=$("#_currentPage").html();
// param.mPageIndex=parseInt(currentPageVar,10)-1;
// sendReq(_url,param);
//
// });
//下一页
// $("#_nextPage").click(function(){
//
// var param=getParam();
// //当前页
// var currentPageVar=$("#_currentPage").html();
// param.mPageIndex=parseInt(currentPageVar,10)+1;
// sendReq(_url,param);
//
// });
//跳转
// $("#_jumpPage").click(function(){
// var jumpPageVar=$("#jumpPageText").val();
//
// if(checkStr(jumpPageVar))
// {
// alert("跳转页请输入有效数字!");
// return;
// }
//
// var param=getParam();
// param.mPageIndex=jumpPageVar;
// sendReq(_url,param);
// });
}
//点击
function clickNumFn(i,url){
var param=getParam();
param.mPageIndex=i;
sendReq(url,param);
}
function pagecClickEnv(url,P)
{
var param=getParam();
//当前页
var currentPageVar=$("#_currentPage").html();
if(P=="N")
{
param.mPageIndex=parseInt(currentPageVar,10)+1;
}else if(P=="U")
{
param.mPageIndex=parseInt(currentPageVar,10)-1;
}else if(P=="L")
{
var lastPageVar= $("#_sizePage").html();
param.mPageIndex=parseInt(lastPageVar,10);
}else if(P=="T")
{
param.mPageIndex=1;
}else if(P=="J")
{
var jumpPageVar=$("#jumpPageText").val();
if(checkStr(jumpPageVar))
{
alert("跳转页请输入有效数字!");
return;
}
var param=getParam();
param.mPageIndex=jumpPageVar;
}
sendReq(url,param);
}
/**
* 发送请求
* **/
function sendReq(_url,obj)
{
$.post(_url,obj,function(returnDatas,status)
{
if(status=="success")
{
var jsonData=JSON.stringify(returnDatas);
eval('callbak_page('+jsonData+')');
//分页信息
var pageinfoHTML = "共 <sapn id='_countPage'>" + returnDatas.mRecords
+ "</sapn>条 第<font color='#FF0000' id='_currentPage'>"
+ returnDatas.mCurrentPage + "</font>/<sapn id='_sizePage'>"
+ returnDatas.mPages + "</sapn>页";
//$("#_pageInfos").html(pageinfoHTML);
//页码显示
var paginationNum="<div>"+pageinfoHTML+"</div><span class=\"next\" rel=\"prev\" οnclick=\"pagecClickEnv('"+_url+"','T')\">首页 </span>";
paginationNum+="<span class=\"next\" rel=\"prev\" οnclick=\"pagecClickEnv('"+_url+"','U')\">< </span>";
for(var i=returnDatas.startNo;i<(returnDatas.startNo+returnDatas.showNum);i++)
{
if(returnDatas.mPages<i){
break;
}
if(returnDatas.mCurrentPage==i)
{
paginationNum+="<a class='pageSelected' οnclick=clickNumFn('"+i+"','"+_url+"')>"+i+" </a>";
}else{
paginationNum+="<a οnclick=clickNumFn('"+i+"','"+_url+"')>"+i+" </a>";
}
}
paginationNum+="<span class=\"next\" rel=\"prev\" οnclick=\"pagecClickEnv('"+_url+"','N')\">> </span>";
paginationNum+="<span class=\"next\" rel=\"prev\" οnclick=\"pagecClickEnv('"+_url+"','L')\">尾页 </span>";
paginationNum+=" "
+"跳到第 <input type=\"text\" size=\"4\" id=\"jumpPageText\"> 页 <a οnclick=pagecClickEnv('"+_url+"','J')>确定 </a>";
//alert(paginationNum);
$("#_pagination").html(paginationNum);
addPageClass();
}else
{
alert("系统异常!");
}
});
}
/**验证数字 true 有 false 没有**/
function checkStr(varStr) {
var included = "1234567890";
//var i;
var c;
for( var i = 0; i < varStr.length; i ++ )
{
c = varStr.charAt(i);
if (included.indexOf(c) ==-1)
{ //在"included"中找不到"c"
return true;
}
}
return false;
}
/** *分页鼠标经过效果** */
function addPageClass(){
$(".pagination a,.pagination span,.btnSure").hover(function() {
$(this).addClass("current");
}, function() {
$(this).removeClass("current");
});
}
/****分页****/
.pagination{padding:20px 0;width:888px;margin:0 auto;color:#adadad;font-size:14px;font-family:"宋体";}
.pagination a,.pagination span{padding:6px 10px;color:#adadad;display:inline-block;margin-left:3px;background:#fff;}
.pagination .pageSelected,.pagination .current{background:#468FCB;color:#fff;text-decoration:none;cursor: pointer;}
.pagination .pageFl{color:#DCDCDC !important; background:#fff !important;}
.pagination span,.pagination a{ vertical-align:middle}
.pagination a{font-family:Arial;}
.pagination span{font-weight:bold;}
<script src="${pagecontext.request.contextpath}/audit/js/util/page.js" type="text/javascript"></script>
<link rel="stylesheet" href="${pagecontext.request.contextpath}/audit/css/pager.css" type="text/css">
<!-- ----------------------页码----------------------------------------------------------- -->
<div class="pagination" id="_pagination">
</div>
后台
package com.youboy.crm.dto.pager;
public class Query {
private int mPageIndex;
private int mPageSize = 20;
private boolean needPage = true;
public Query() {
super();
}
public Query(int mPageIndex, int mPageSize) {
this.mPageIndex = mPageIndex;
this.mPageSize = mPageSize;
}
public int getmPageIndex() {
return mPageIndex > 0 ? mPageIndex : 1;
}
public void setmPageIndex(int mPageIndex) {
this.mPageIndex = mPageIndex;
}
public int getmPageSize() {
return mPageSize > 0 ? mPageSize : 0;
}
public void setmPageSize(int mPageSize) {
this.mPageSize = mPageSize;
}
public int getmStartRow() {
if (mPageIndex <= 0) {
return 0;
}
return (mPageIndex - 1) * mPageSize;
}
public boolean isNeedPage() {
return needPage;
}
public void setNeedPage(boolean needPage) {
this.needPage = needPage;
}
@Override
public String toString() {
return "Query [mPageIndex=" + mPageIndex + ", mPageSize=" + mPageSize
+ ", needPage=" + needPage + "]";
}
}
package com.youboy.crm.dto.pager;
import java.util.List;
public class QueryResult<T> {
private int mPages; // 总页数
private long mRecords;// 总记录数
private List<T> mItems;
private int mCurrentPage = 1;// 当前页
private int startNo;// 起始号
private int showNum = 10;// 显示号的数量
public int getmPages() {
return mPages;
}
public void setmPages(int mPages) {
this.mPages = mPages;
}
// 计算总页数
public void setmPages(long mRecords, long mpageSize) {
this.mRecords = mRecords;
if (mRecords <= 0) {
this.mPages = 1;
return;
}
if (mRecords <= mpageSize) {
this.mPages = 1;
return;
}
long totalPages = mRecords / mpageSize;
this.mPages += (totalPages + (mRecords % mpageSize == 0 ? 0 : 1));
}
public long getmRecords() {
return mRecords;
}
public void setmRecords(long mRecords) {
this.mRecords = mRecords;
}
public List<T> getmItems() {
return mItems;
}
public void setmItems(List<T> mItems) {
this.mItems = mItems;
}
public int getmCurrentPage() {
if (mCurrentPage <= 0) {
mCurrentPage = 1;
}
if (this.getmPages() < mCurrentPage) // 如果当前页大于数据页
{
mCurrentPage = this.getmPages();
}
return mCurrentPage;
}
public void setmCurrentPage(int mCurrentPage) {
this.mCurrentPage = mCurrentPage;
}
public int getStartNo() {
if (startNo <= 0) {
return 1;
}
return startNo;
}
public static int getStartNo2(int pages, int showNum, int cIndex) {
// 根据当前页计算起如行
if (pages < cIndex) {
// System.out.println("cget"+getmPages());
cIndex = pages;
} else if (cIndex <= 0) {
// cIndex=1;
}
if (cIndex % showNum == 0) {
// 当前页-显示的行数
// System.out.println(cIndex-showNum+1);
return cIndex - showNum + 1;
} else {
// 如果当前页小于起始行
if (cIndex < showNum) {
return 1;
} else {
// 当前页-余数(当前面和显示的行数)
return cIndex - (cIndex % showNum)+1;
}
}
}
public void setStartNo(int startNo) {
this.startNo=startNo;
// System.out.println("cIndex:"+cIndex);
// System.out.println(showNum);
// System.out.println(startNo);
// 根椐起始行》》》 当前页%显示的数量==是否翻页
// if (getmCurrentPage() % showNum == 1) {
// if (getmPages() <= startNo) {
// this.startNo = getmPages() - showNum;
// } else {
// this.startNo = getmCurrentPage();//+ 1;
// }
//
// } else if (getmCurrentPage() % showNum == 0) {
// this.startNo = getmCurrentPage() - showNum;
// } else {
// this.startNo = startNo;
// }
// if (startNo <= 0||this.startNo<=0) {
// this.startNo = 1;
// }
}
public int getShowNum() {
return showNum;
}
public void setShowNum(int showNum) {
this.showNum = showNum;
}
@Override
public String toString() {
return "QueryResult [mPages=" + mPages + ", mRecords=" + mRecords
+ ", mItems=" + mItems + ", mCurrentPage=" + mCurrentPage
+ ", startNo=" + startNo + ", showNum=" + showNum + "]";
}
public static void main(String[] args) {
int s = 5;
int index = 19;
System.out.println(index % s);
if (index % s == 0) {
// 当前页-显示的行数
System.out.println(index - s + 1);
} else {
// 如果当前页小于起始行
if (index < s) {
System.out.println(1);
} else {
// 当前页-余数(当前面和显示的行数)
System.out.println("f:" + (index - (index % s)+1));
}
}
}
}
改进分页效果2
/**
* 12 3 45
* @param pages
* @param showNum
* @param cIndex
* @return
*/
public static int getStartNo3(int pages, int showNum, int cIndex) {
int starti=1;
if(cIndex <pages)
{
if(pages>cIndex+showNum)
{
starti=pages-showNum+1;
}else{
//当前页-显示行数/2
starti=cIndex-(showNum/2);
}
}
//当前页大于(行数/2)
if(cIndex>showNum/2)
{
//当前页-显示行数/2
starti=cIndex-(showNum/2);
}
if(cIndex<5||cIndex<0){
starti=1;
}
//如果当前页大于总页数
// if(pages<=cIndex+showNum)
// {
// starti=pages-showNum+1;
// }
//System.out.println(starti);
// System.out.println();
// for(int i=starti;i<starti+showNum;i++)
// {
// System.out.print(" "+i);
// }
return starti;
}