springmvc ajax mysql_Java 丨 springMVC + Ajax 来进行分页

javaweb 分页技术 实现的方式有很多种，但是小编在网上问了度娘也问了谷老师，得到的答案让小编我不是很满意，so，还是自己写吧！

在小编的博文中，小编不会上传源码，只会把重要的代码和思路供大家参考！

如果只想要实现代码的读者们就不要继续观看此文章。

主题：Javaweb 分页技术实现详解

1、首先我们来解析一下分页实现需要的一些变量有哪些：

**upPage：**上一页

**nextPage：**下一页

**nowPage：**当前的页数

**sumPage：**总页数

**list：**需要显示的数据

**count：**显示的条数

2、在上面我们知道了需要一些什么参数，那么我们怎么获得这些参数呢？

1)我们首先从后台加载一次要显示的数据到页面上

request.setAttribute("list", list);//需要显示在界面的数据

request.setAttribute("count", list.size());//在界面上显示的当前页条数

request.setAttribute("nowPage", nowPage);//现在是多少页

request.setAttribute("sumPage", sumPage);//总页数多少页

2)把第一条中对应的参数在后台传到 view 层 ，显示如下格式：

|　　姓名　　|　　年龄　　|　　班级　　|

|　　张山　　|　　19　　 |　　3 班　　 |

|　　李四　　|　　20　　 |　　1 班　　 |

|　 王麻子 　|　　18　　 |　　5 班　　 |

----3 条------------上一页--1/20--下一页--

参数对应如下：

3 条：${count}

1:${nowPage}

20:${sumPage}

以上就是我们在分页之前做的准备工作，接下来就是 ajax 的事情了

3.设置上一页下一页的点击事件：

/*

下一页

*/

("#nextPage").click(function(){ 　　//alert("----"); 　　//判断是否不是最后一页 if(("#pageNum").html().indexOf(("#sumPage").html())!=-1){ alert("已经是最后一页了"); return; } else {//不为最后一页就查找下一页的内容.post("next.duanniu",

{

page:""+("#pageNum").html(), sumPage:""+("#sumPage").html()

},

function(data,status){//返回状态

("#att").empty();//设置tbody的内容为空 if(status=="success"){ var jsonData = JSON.parse(data); var jsonStr = ""; var record = 0;.each(jsonData, function(i, item){

jsonStr+=""+

""+item.id+""+

""+item.name +""+

""+item.area +""+

""+item.empower +""+

""+item.belong +""+

""+item.state +""+

""+

""+

""+

" 直推查看"+

""+

" "+

" 树状图"+

" "+

" "+

""+

"";

record = i+1;

});

("#att").empty().append(jsonStr);("#recordCount").html("共"+record+"条");

//设置页数

("#pageNum").html(""+(parseInt(("#pageNum").html())+1));

}

});

}

});

/*

上一页

*/

("#upPage").click(function(){ //判断是否不是最后一页 if(parseInt(("#pageNum").html())-1==0){

alert("已经是第一页了");

return;

} else {//不为最后一页就查找下一页的内容

.post("next.duanniu", { page:""+parseInt(("#pageNum").html())-2,

sumPage:""+("#sumPage").html() }, function(data,status){//返回状态("#att").empty();//设置 tbody 的内容为空

if(status=="success"){

var jsonData = JSON.parse(data);

var jsonStr = "";

var record = 0;

.each(jsonData, function(i, item){ //alert("--"+jsonData); jsonStr+=""+ ""+item.id+""+ ""+item.name +""+ ""+item.area +""+ ""+item.empower +""+ ""+item.belong +""+ ""+item.state +""+ ""+ ""+ ""+ " 直推查看"+ ""+ " "+ " 树状图"+ " "+ " "+ ""+ ""; record = i+1; });("#att").empty().append(jsonStr);

("#recordCount").html("共"+record+"条"); //设置页数("#pageNum").html(""+(parseInt($("#pageNum").html())-1));

}

});

}

});

备注：以上由于时间关系，很久的博文内容不完善，还请见谅！希望能帮到读者。

=======祝各位读者生活愉快======