LayPage 1.0 发布，适用多场景 JavaScript 分页

laypage主要应用于前端页面Ajax普通分页以及信息流加载，并且可无缝迁移至Node.js平台。她不依赖于任何第三方库，直接拿来用即可，其接口继承了layui系列组件的一贯简洁，极易上手。那么，从现在开始，将分页的任务交给laypage吧！

加载laypage

获得laypage包后，把整个文件存放到你的目录。直接通过script标签引入laypage.js即可，无需引入css。你还可以通过seajs或者requirejs加载laypage。如：

var laypage = require('laypage');  laypage({      cont: 'id',      pages: 11,      …  })

使用

laypage并没有额外去封装Ajax，她只负责分页的核心功能，并且提供了关键性回调函数jump，每触发一次跳页，jump都会被执行，并且返回一些配置信息，其中包括当前页（curr），通过它，你可以去向服务端请求指定数据，如

laypage({      cont: 'page1', //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>      pages: 66, //总页数      curr: 6, //当前页      jump: function(e){ //触发分页后的回调          //触发分页后的回调          var curr = e.curr; //获得当前页后，去向服务端发送请求，获得相关数据。      }  });

laypage还可以自定义皮肤

laypage({      cont: document.getElementById('page2'), //容器。值支持id名、原生dom对象，jquery对象,      pages: 100, //总页数      skin: 'yahei', //加载内置皮肤，也可以直接赋值16进制颜色值，如:#c00      groups: 7 //连续显示分页数  });

开启跳页

laypage({      cont: $('#page3'), //容器。值支持id名、原生dom对象，jquery对象,      pages: 100, //总页数      skip: true, //是否开启跳页      skin: '#AF0000',      groups: 3 //连续显示分页数  });

自定义文本

laypage({      cont: 'page4', //容器。值支持id名、原生dom对象，jquery对象,      pages: 11, //总页数      skin: 'molv', //皮肤      first: '首页', //若不显示，设置false即可      last: '尾页', //若不显示，设置false即可      prev: '<', //若不显示，设置false即可      next: '>' //若不显示，设置false即可  });

开启hash。laypage会自动对url追加#!laypage_{id}={curr}。利用这个，可以在页面载入时就定位到指定页

laypage({      cont: 'page6', //容器。值支持id名、原生dom对象，jquery对象,      pages: 68, //总页数      hash: true, //会对url追加#!laypage_      jump: function(obj){                }  });

只出现上一页/下一页

laypage({      cont: 'page7', //容器。值支持id名、原生dom对象，jquery对象,      pages: 11, //总页数      groups: 0,      first: false,      last: false,      jump: function(obj){          $('#view7').html('目前正在第'+ obj.curr +'页，一共有：'+ obj.pages +'页');      }  });

信息流

laypage({      cont: 'page8', //容器。值支持id名、原生dom对象，jquery对象,      pages: 7, //总页数      groups: 0, //连续分数数0      prev: false, //不显示上一页      next: '查看更多',      skin: 'flow', //设置信息流模式的样式      jump: function(obj){          var curr = obj.curr;          if(curr === 6){              this.next = '没有更多了';          }          //以下加上append操作      }  });

更详细的文档以及DEMO，参见：http://sentsin.com/layui/laypage