java web js完美分页,只需一个div

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\"	onclick=\"pagecClickEnv('"+_url+"','T')\">首页 </span>";
				paginationNum+="<span class=\"next\" rel=\"prev\"	onclick=\"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' onclick=clickNumFn('"+i+"','"+_url+"')>"+i+" </a>";
					}else{
						paginationNum+="<a onclick=clickNumFn('"+i+"','"+_url+"')>"+i+" </a>";
					}
					
				}
				
				paginationNum+="<span class=\"next\" rel=\"prev\" onclick=\"pagecClickEnv('"+_url+"','N')\">> </span>";
				paginationNum+="<span class=\"next\" rel=\"prev\"	onclick=\"pagecClickEnv('"+_url+"','L')\">尾页 </span>";
				paginationNum+="    "
				+"跳到第  <input type=\"text\" size=\"4\" id=\"jumpPageText\"> 页   <a onclick=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));
			}
		}
		
		
		
	

	}

}

java web js完美分页,只需一个div

原文：http://blog.csdn.net/liangrui1988/article/details/44652299