jquery返回上一页 jquery 翻页

笔者前一段时间在做项目时，由于项目需求要用到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改成替换