笔者前一段时间在做项目时，由于项目需求要用到jquery实现翻页，遂自己专研了一种翻页的方法，还希望大家指点。
做之前先写思路，这是笔者的一个习惯。也可以帮助自己理清关系。
功能需求是：点击“加载更多"实现数据在下面加载
1.页面刚刚加载时通过ajax获取首次绑定的数据
2.点击加载更多后通过ajax获取第二次加载的数据
3.把需要加载的数据循环追加在第一次后面
//num:每一页需要加载信息的条数
// i：自加参数, i 默认为0
页面刚刚加载前端代码：
$.ajax({
type: "post",
url: "index/textAjax",
contentType: "application/json",
dataType: "json",
data: "{num:'" + 10+ "',i:'" + i+ "'}",
success: function (data) {
//页面刚刚加载时输出的数据
var Htmls = "";
for (var i = 0; i < data.length; i++) {
+"<div>"
+"<ul>"
+"<li>"
+data[i].name
+"</li>"
+"<li>"
+data[i].sex
+"</li>"
+"<li>"
+data[i].age
+"</li>"
+"</ul>"
+"</div>"
}
$("#cent").html(Htmls);
}
})
//点击加载跟多后页面显示的数据,用jquery追加在第一次显示信息的后面
//现将i的值加一
i=i+1；
$.ajax({
type: "post",
url: "index/textAjax",
contentType: "application/json",
dataType: "json",
data: "{num:'" + 10+ "',i:'" + i+ "'}",
success: function (data) {
//页面刚刚加载时输出的数据
for (var i = 0; i < data.length; i++) {
$("#cent").appent(
+ "<div><ul>"
+"<li>"
+data[i].name
+"</li>"
+"<li>"
+data[i].sex
+"</li>"
+"<li>"
+data[i].age
+"</li>"
+"</ul></div>"
)
}
}
})
//后台方法：
[HttpPost]
public ActionResult textAjax(string num, string i)
{
if(i=0)
{
var data=select top num * from A ;
return Json(data);
}
else
{
var data=select top num * from A where id not in (select top num*i id from A)
return Json(data);
}
}
以上代码就能实现一个简单的jquery分页，根据此逻辑也可以实现上一页，下一个，首页，最后一页，只需把appent和remove改成替换