最近在开发过程中经常用到分页,今天挤出些时间来捋一捋自己的经验
在网络开发中,一般显示数据列表页时,我们会用到分页控件来显示数据。采用分页一般基于两种不同的需求,一种是数据量不算很大,但是在页面展示又显得过长,看起来很不舒服,一种则是因为数据量太过于庞大,无法一次性去数据库将数据读取出来,于是采用分页的形式去将数据分页显示出来。
前者即所谓的前端分页,而后者就是服务端分页。
两者的区别在于:前端分页是将所有数据取出,为方便用户查看,合理展示数据。在前端js上对数据进行分页。而服务端分页是根据当前页面要展示的内容,通过前端传入的参数,获取对应页面的数据进行展示。简而言之就是前端分页是在前端对数据进行分页,服务端分页这是在后台对数据进行分页。
下面分别展示下使用layPage分页控件两者的用法
假设后台返回的数据对象如下:
公共类人{
公共字符串名称{获取;设置;}=string.Empty;
公共int年龄{获取;设置;}=0;
}//获取的数据是
Listplist;//JsonConvert.SerializeObject()为序列化对象
返回Json (JsonConvert.SerializeObject (plist));
1。前端分页
//引用分页控件
& lt;链接rel="样式表" type=" text/css " href=" https://www.yisu.com/content/H-UI.Admin/lib/laypage/1.2/skin/laypage.css "/比;
& lt;脚本type=" text/javascript " src=" https://www.yisu.com/zixun/~/内容/H-UI.Admin/lib/laypage/1.2/laypage.js”祝辞& lt;/script>
& lt;脚本type=" text/javascript祝辞
$(函数(){//获取数据
$ . post (“/liveajax/getData”功能(数据){
var loaddata=https://www.yisu.com/zixun/jQuery.parseJSON(数据);//将后台获取的json对象转换为数组
loadData (loadData);
})
})
函数loadData(数据){
var num=10;//每页出现的数量//模拟渲染
var渲染=function(数据、咕咕叫){
var arr=[]条=data.concat ()。拼接(咕咕叫* nums-nums, num);
(var=0;我
页:页面,//通过后台拿到的总页数
咕咕叫:pageIndex,//当前页
跳:函数(obj,首先){//触发分页后的回调
如果(!){//点击跳页触发函数自身,并传递当前页:obj.curr
queryPara。页面=obj.curr;
pageQuery ();
}
}
});
}
& lt;/script>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
