如何使用jQuery的Ajax++JSON实现分页显示java+jQuery实现异步分页

首先给你看操作效果图：
1。后台操作生成JSON数据。
列出黑名单= blackservice.getblackinfolist（mobilenum，GatewayId，开始日期，结束日期）；
totalrows = blacklist.size int（）；
StringBuffer某人新的StringBuffer（）；
Sb.append（测度{ + totalrows +
Sb.append（jsonroot ：{）；
为（int i = 0；i < blacklist.size（）；i++）{
lblack blackinfo =（lblack）blacklist.get（我）；
Sb.append（身份{ （+ blackinfo。GetID））；
Sb.append（
Sb.append（移动+ blackinfo.getmobile（））；
Sb.append（
Sb.append（省+ blackinfo.getprovince（））；
Sb.append（
Sb.append（网关：+ blackinfo.getgateway（））；
Sb.append（
Sb.append（inserttime + blackinfo.getinserttime（））；
Sb.append（
Sb.append（说：+ blackinfo.getremark（））；
Sb.append（）；
Sb.append（}，）；
}
sb.deletecharat（sb.lastindexof（
Sb.append（} } ）；
ServletActionContext.getResponse（）httpservletresponse反应=；
response.setcontenttype（文本/平原）；
response.getwriter（）打印（某人）；
2.struts.xml相关配置
UTF-8
/ / /：JSP管理 / black.jsp

3.js获取JSON数据分页显示
功能getjsondata（PN）{
警报（PN）；
美元。getJSON（黑名单。CE
VaR测度= data.totalcount； / /总记录数
VaR PageSize = 10； / /每页几条记录
pagetotal = math.ceil（VaR测度 / / / PageSize）；总页数
VaR的起始= PageSize *（PN 1）；
var = 1 +为起始页末页；
UL = $（var $ # JSON列表）；
ul.empty美元（）；
对于（var i = 0；i < PageSize；i++）{
ul.append美元（' '）；
}
var = data.jsonroot数据库；
如果（pagetotal = = 1）{ / /只有一页
对于（var j = 0；J <测度；j++）{
$（李标记）。
（。追加+ parseInt（j + 1）
+ ）。追加（+数据库{ }移动J。
+ ）。追加（+数据库{ }省J。
+ ）。追加（+数据库{ J }。网关
+ ）。追加（+数据库{J}. inserttime { }。
+ ）。追加（+数据库{ }话J。
+
}
{人}
对于（var j =起始页，k = 0；J <末页，K＜PageSize；J + +，K +）{
如果（J = =测度）{
当遍历到最后一个记录时，退出循环。
}
$（李标记）。Eq（k）。
（。追加+ parseInt（j + 1）
+ ）。追加（+数据库{ }移动J。
+ ）。追加（+数据库{ }省J。
+ ）。追加（+数据库{ J }。网关
+ ）。追加（+数据库{J}. inserttime { }。
+ ）。追加（+数据库{ }话J。
+
}
}
$（。页面计数）文本（pagetotal）；
}）
}
功能getpage（）{
美元。getJSON（黑名单。CE
pn＝1；
VaR测度= data.totalcount； / /总记录数
VaR PageSize = 10； / /每页几条记录
pagetotal = math.ceil（VaR测度 / / / PageSize）；总页数
$（#下）。Click（function（）{）
如果（Pn = = pagetotal）{
警报（不在后面）；
Pn = pagetotal；
{人}
pn +；
ToPage（PN）；
}
}）；
$（# prev）。Click（function（）{）
如果（pn = 1）{
警报（不在前面）；
pn＝1；
{人}
PN -；
ToPage（PN）；
}
}）
$（#第一页）。Click（function（）{）
pn＝1；
ToPage（PN）；
}）；
$（# LastPage）。Click（function（）{）
Pn = pagetotal；
ToPage（PN）；
}）；
$（#页面跳转）。Click（function（）{）
如果（$（。页号），瓦迩（pagetotal）< = $（。页面数）（。Val）= {！）
pn = $（）。瓦迩（）；
ToPage（PN）；
其他{ }
警报（）您输入的页数是错误的！；
$（）瓦迩；
}
}）
$（#第一页）。Trigger（点击）；
}）
}
功能页（PN）{
警报（PN）；
$（当前页）。文本（pn）；
getjsondata（PN）
}
$（函数（）{（））
GetPage（）；
}）
PS：java + jQuery实现异步分页

最近的项目要求异步分页，只需编写它，并指出错误。
*分页类
* /
公共课PageBean {
publicint行数= 0； / /总记录数
publicint currentpage = 1； / /当前页
publicint sizeperpage = 20； / /页码
publicint总页数= 0； / /总页数
publicstring pageurl； / /请求URL
publicstring页面所显示； / / JSP页面
publicstring pagestyle =numberstyle ； / /分页样式
publicint pagepreoffset = 10； / /向前偏移
publicint pagenextoffset = 9； / /向后偏移
publicstring pagecss； / /预订
publicstring getpagecss（）{
returnpagecss；
}
publicvoid setpagecss（字符串pagecss）{
this.pagecss = pagecss；
}
publicstring getpagestyle（）{
returnpagestyle；
}
publicvoid setpagestyle（字符串pagestyle）{
this.pagestyle = pagestyle；
}
publicint getpagepreoffset（）{
returnpagepreoffset；
}
publicvoid setpagepreoffset（intpagepreoffset）{
this.pagepreoffset = pagepreoffset；
}
publicint getpagenextoffset（）{
returnpagenextoffset；
}
publicvoid setpagenextoffset（intpagenextoffset）{
this.pagenextoffset = pagenextoffset；
}
PublicString getPageDisplay（）{
字符串nextclick =onclick= 'ajaxpage（+本。pageurl +currentpage =+（this.currentpage + 1）+）；return false；；；
字符串preclick =onclick= 'ajaxpage（+本。pageurl +currentpage =+（this.currentpage - 1）+）；return false；；；
字符串firstclick =onclick= 'ajaxpage（+本。pageurl +currentpage = 1 ）；return false；；；
字符串lastclick =onclick= 'ajaxpage（+本。pageurl +currentpage =+（this.getpagecount（））+）；return false；；；
字符串的变化=onchange = 'ajaxpage（+本。pageurl +currentpage =+（1）+）；return false；；；
StringBuffer pagestring =新StringBuffer（）；
PageString.append（）；
数字样式
如果（numberstyle。EqualsIgnoreCase（这。pagestyle））{
如果只有一页，没有分页
如果（this.getpagecount（）= = 1）{
/ / pagestring.append（1 ）；
{ }人
如果（this.currentpage > 1）{ / /如果当前页是大于1，<<可用
PageString.append（< class= 'pagination-first+ firstclick +标题= '网页href =+ this.pageurl
+ currentpage = 1>）；
PageString.append（< class= 'pagination-prev+ preclick +title=href =+ this.pageurl
+ currentpage =+（this.currentpage - 1）
+；
{ }人
pagestring
追加（）；
pagestring
追加（）；
}
前向/偏移量的定义
intpreoffset = 1 > this.pagepreoffset this.pagepreoffset this.currentpage
this.currentpage - 1；
定义回偏移距
intnextoffset = this.getpagecount（）-this.currentpage > this.pagenextoffset this.pagenextoffset
This.getPageCount（）-this.currentpage；
循环显示链接号，从当前页到当前页偏移量，由前向和后向偏移
为（int i =（this.currentpage - preoffset）；我（this.currentpage + nextoffset）；i++）{
字符串numclick =onclick= 'ajaxpage（+本。pageurl +currentpage =+（我）+）；return false；；；
如果（this.currentpage =我）{ / /显示当前页。
PageString
追加（）
+；
{ }人
PageString.append（<+ numclick +href =+ this.pageurl
+ currentpage =+我+>+我+ ）；
}
}
如果当前页小于可用页的总页数。
如果（this.currentpage < this.getpagecount（））{
PageString.append（< class= 'pagination-next+ nextclick +title=href =+ this.pageurl
+ currentpage =+（this.currentpage + 1）
>>；
PageString.append（< class= 'pagination-last+ lastclick +title=href =+本。pageurl。
+ currentpage =+（（这。getpagecount））+> > > ）；
{ }人
pagestring
添加（）；
pagestring
添加（）；
}
PageString.append（+ this.getoptions（）+）；
}
} else if（normalstyle。EqualsIgnoreCase（这。pagestyle））{
如果（this.getpagecount（）= = 1）{
PageString.append（共1页）；
{ }人
如果（this.currentpage > 1）{
PageString.append（< class= 'pagination-first+ firstclick +标题= '网页href =+ this.pageurl
+ currentpage = 1>）；
PageString.append（< class= 'pagination-prev+ preclick +title=href =+ this.pageurl
+ currentpage =+（this.currentpage - 1）
+；
{ }人
pagestring
追加（）；
pagestring
追加（）；
}
PageString.append（+本。currentpage + 页面 / +本。总页数+页）；
如果（this.currentpage < this.getpagecount（））{
PageString.append（< class= 'pagination-next+ nextclick +title=href =+ this.pageurl
+ currentpage =+（this.currentpage + 1）
>>；
PageString.append（< class= 'pagination-last+ lastclick +title=href =+本。pageurl。
+ currentpage =+（（这。getpagecount））+> > > ）；
{ }人
pagestring
添加（）；
pagestring
添加（）；
}
PageString.append（+ this.getoptions（）+）；
}
}
PageString.append（）；
this.pagedisplay = pagestring.tostring（）；
returnpagedisplay；
}
publicvoid setpagedisplay（字符串页面所显示）{
this.pagedisplay =页面所显示；
}
publicstring getpageurl（）{
returnpageurl；
}
publicvoid setpageurl（字符串pageurl）{
this.pageurl = pageurl；
}
publicint getpagecount（）{
this.pagecount =这。行数this.sizeperpage = = 0（% this.rowcount /本。sizeperpage）
+ 1（this.rowcount： /本。sizeperpage）；
returnthis.pagecount；
}
publicvoid setpagecount（intpagecount）{
this.pagecount =总页数；
}
publicint getrowcount（）{
returnrowcount；
}
publicvoid setrowcount（introwcount）{
this.rowcount =行数；
}
publicint getcurrentpage（）{
returncurrentpage；
}
publicvoid setcurrentpage（intcurrentpage）{
this.currentpage = currentpage；
}
publicint getsizeperpage（）{
returnsizeperpage；
}
publicvoid setsizeperpage（intsizeperpage）{
this.sizeperpage = sizeperpage；
}
privatestring getoptions（）{
StringBuffer某人新的StringBuffer（）；
开关（这个。sizeperpage）{
病例10：
Sb.append（10203050100）；
打破；
case20：
Sb.append（20103050100）；
打破；
case30：
Sb.append（30102050100）；
打破；
case50：
Sb.append（50102030100）；
打破；
case100：
Sb.append（10010203050）；
打破；
}
returnsb.tostring（）；
}
}

背景/调用
PageBean页=新PageBean（）；
setpageinfo（名单，要求）；
公共无效setpageinfo（列出名单，HttpServletRequest请求）{
Page.setCurrentPage（this.getcurrentpage（））；
如果（request.getparameter（persize ）= = null）{
Page.setSizePerPage（20）； / /默认20
}
别的{
Page.setSizePerPage（integer.valueof（request.getparameter（persize ））））；
}
Page.setRowCount（list.size（））；
/ / page.setpagestyle（normalstyle ）；
/ / page.setpagepreoffset（5） / /默认10；
/ / page.setpagenextoffset（4） / /默认9；
Page.setPageURL（request.getrequesturl（）ToString（））；
}
{ }查看CSS plaincopyprint

* CSS
* /
。numberstyle，normalstyle {。
文本对齐：左对齐；
}
。numberstyle，normalstyle一{。
显示：内联块；
# 5489f1颜色；
文字装饰：无；
字体大小：14px；
字体粗细：粗体；
字体家庭：日内瓦，Arial，Helvetica，sans-serif；
边境：1px solid # 999；
宽度：20px；
身高：20px；
行高：20px；
文本对齐：中心；
背景位置：中心；
}
。numberstyle强，normalstyle强{。
显示：内联块；
颜色：# 5489f1；
文字装饰：无；
字体大小：14px；
字体粗细：粗体；
字体家庭：日内瓦，Arial，Helvetica，sans-serif；
边境：1px solid # 999；
宽度：20px；
身高：20px；
行高：20px；
文本对齐：中心；
背景位置：中心；
}
。numberstyle：悬停，悬停。normalstyle：{
背景颜色：# d0d0d0；
}
。normalstyle。Pageinfo {
字体大小：14px；
字体家庭：日内瓦，Arial，Helvetica，sans-serif；
颜色：# 5489f1；
}

{ }查看plaincopyprint Javaｓｃｒｉｐｔ

*** JS进口jquery.js之前调用函数
* /
功能ajaxpage（行动）{
行动=动作+persize =+ $（# pageselect ）（。Val）；
$ ajax（{
类型：邮政
网址：行动，
成功：函数（MSG）{
/回调函数，后台字符串返回MSG
删除原始数据，添加新数据
例如： / / $（#显示器工作台运转>螺纹）（。nextall）（去除）；$（#显示器工作台运转）。追加（MSG）；
}
}）；
}
以上是本文的使用介绍如何使用jQuery的Ajax + + JSON实现分页显示java + jQuery实现异步分页，希望对你有帮助。