网络知识 娱乐 Layui第十天学习

Layui第十天学习

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>分页</title> <!--layui模块化使用--> <link rel="stylesheet" type="text/css" href="layui/css/layui.css"> <script src="layui/layui.js" text="text/javascript" charset="utf-8"></script> </head> <body> <div id="page"></div> <div id="page1"></div> <script text="javascript"> //加载laypage模块 layui.use("laypage",function(){ var laypage = layui.laypage; laypage.render({ elem: "page", //elem绑定的是容器的ID属性 count: 100, //总数量,可以通过服务器得到 limit:5, //每页显示的数量 limits:[5,10,20,30], //每页条数的选择项 layout:['prev','page','next','limit','count'], //自定义排版 groups:10, //连续显示的页码数 }); //切换分页的回调 laypage.render({ elem: "page1", count: 50, groups: 10, layout:['prev','page','next','limit','count'], limits:[5,10,20], jump: function(obj,first){ //obj包含了当前分页的所有参数 console.log("当前页:"+obj.curr); //等到当前页,以便向服务器请求对应页的数据 console.log("每页显示的条数:"+obj.limit); //得到每页显示的条数 //首次不执行 if(!first){ //执行其它逻辑 } } }); }); </script> </body></html>