jquery 前台数据分页

// JavaScript Document

$(document).ready(function(){

$('#page_break .num li:first').addClass('on')

$('#page_break .num li').click(function(){

//隐藏所有页内容

$("#page_break div[id^='page_']").hide()

//显示当前页内容。

if ($(this).hasClass('on')) {

$('#page_break #page_' + $(this).text()).show()

} else {

$('#page_break .num li').removeClass('on')

$(this).addClass('on')

$('#page_break #page_' + $(this).text()).fadeIn('normal')

}

})

})

首先你需要一个pageBean类，用来定义一些分页需要的数据！

public class PageBean<T>{

private int pageCount = 0 // 总页数

private List<T>pageData = null// 当前页数据集

private int pageSize = 10 // 每页大小

private int currentPage = 1// 当前页

private long totalRecord = 0 // 总记录数

private int beginIndex = 0 // 分页起始记录号

private int endIndex = 1 // 分页结束记录号

public int getPageCount() {

pageCount = (int)(totalRecord + pageSize -1)/pageSize

return pageCount

}

public void setPageCount(int pageCount) {

this.pageCount = pageCount

}

public List<T>getPageData() {

return pageData

}

public void setPageData(List<T>pageData) {

this.pageData = pageData

}

public int getPageSize() {

return pageSize

}

public void setPageSize(int pageSize) {

this.pageSize = pageSize

}

public int getCurrentPage() {

if (currentPage <1) {

currentPage = 1

}

return currentPage

}

public void setCurrentPage(int currentPage) {

this.currentPage = currentPage

}

public long getTotalRecord() {

if (totalRecord <0) {

totalRecord = 0

}

return totalRecord

}

public void setTotalRecord(long totalRecord) {

this.totalRecord = totalRecord

}

public int getBeginIndex() {

beginIndex = (currentPage - 1) * pageSize+1

return beginIndex

}

public void setBeginIndex(int beginIndex) {

this.beginIndex = beginIndex

}

public int getEndIndex() {

endIndex = currentPage * pageSize

return endIndex

}

public void setEndIndex(int endIndex) {

this.endIndex = endIndex

}

}

页面上，使用jQuery的Ajax发送后台请求信息:

$.ajax({

type:"post",

url:"requestPage",

dataType:"json",

data:{这里就是封装数据的地方，比如你要到第二页的时候，在这之前要读取当前的页数，并进行适当的判断，是键值对的形式例如:"current":1,"pageSize":10},

success:function(data){

这里是返回json字符串

var jsonObj=$(data)

然后解析遍历json

$.each(data.pageData,function(index,item){

这个回调函数里面的第一个参数是下标，第二个参数是集合里面的单个对象

然后生成显示…………结束

})

}

}):

---