nodejs+layui+laytpl实现分页的例子

网站:

http://www.layui.com/doc/modules/laypage.html


   
<div class="layer-left-box-foot-right">
    <div id="pageDemo">div>
div>


html页面的js代码:


<script>
    var sum='{{ d.data.size}}';  //后台页面传过来的数据大小 假如:sum=100
    var pages=Math.ceil(sum/10); //页面的分页大小 pages=100/10=10
     var curr='{{d.curr}}';
    layui.use(['layer', 'laypage', 'element'], function(){
        var layer = layui.layer
                ,laypage = layui.laypage
        //分页
        laypage({
            cont: 'pageDemo',//容器。值支持id名、原生dom对象,jquery对象,

            pages: pages, //可以叫服务端把总页数放在某一个隐藏域,再获取。假设我们获取到的是18
            curr: curr,  //当前页,页面点击
            skip:true,  //开启跳转
            hash: curr,  //跳转到哪一个页面
            jump: function(e, first){ //触发分页后的回调
                if(!first){ //一定要加此判断,否则初始时会无限刷新
                    var pageNum=e.curr*10-10;  //这是后台需要接受的值,我们采用的是mysql,limit去查询数据,pageNum这个值是查询数据的起始数据。
                location.href = '?pageNum='+pageNum;  // 比如:http://localhost:8888/admin/goods?pageNum=10
                }
            }
        });
    });
script>



后台使用的是nodejs:

var page="";   //用来存放页面传过来的值
console.log("req.query.pageNum:"+req.query.pageNum)
  if(req.query.pageNum == undefined){
      page=0;
  }else{
      page=req.query.pageNum;
  }
var numpage=parseInt(page)+10;
var curr=parseInt(numpage/10);
console.log("数据起始位置:"+page);
var a = {pageNo:page};//goodsStatus:0,

自己慢慢琢磨出来的,非常好用的分页。


效果:


你可能感兴趣的:(nodejs)