使用layui框架的分页
参数:
elem-->显示页码的容器的id
count-->总记录数
layout-->显示内容的布局
count总页数
prev上一页
page数字
next下一页
limit每页显示数量
skip跳转到第几页
limit-->每页显示的数量
groups-->连续显示的页码数量
jump-->点击数字执行的方法
curr-->当前显示第几页
代码如下:
<html>
<head>
<meta charset="utf-8">
<title>wanmait</title>
<!-- 导入layui框架 -->
<script type="text/javascript" src="layui/layui/layui.js"></script>
<link type="text/css" rel="stylesheet" href="layui/layui/css/layui.css">
</head>
<body>
<div id="numbers"></div>
<script>
layui.use('laypage', function(){
var laypage = layui.laypage;
//执行一个laypage实例
laypage.render({
elem: 'numbers', //id
count: 50, //数据总数，从服务端得到
layout:["count","prev","page","next","limit","skip"],
limits:[5,10,15,20],//每页条数选择
limit:5,//默认10
groups:4,//连续页码个数 默认5
prev:"<<",
next:">>",
first:"首页",
last:"尾页",
jump:function(obj,first){
//点击数字执行 网页加载就会执行一次
//first是否是首次 首次为true
console.log(obj.curr);//当前第几页
console.log(obj.limit);//每页显示数量
if(!first){
console.log("首次不执行");
}
},
curr:7,//当前显示第几页
hash:"fenye"
});
});
</script>
</body>
</html>
0条评论
点击登录参与评论