js分页插件layPage使用笔记

最新推荐文章于 2022-08-30 09:36:12 发布

原创最新推荐文章于 2022-08-30 09:36:12 发布 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

HTML/CSS/JS 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何使用layui提供的laypage分页插件。通过简单的三步：引入JS和CSS文件、编写HTML代码以及添加JS渲染代码，即可实现美观且功能强大的网页分页效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.说明

1.官网 http://www.layui.com/demo/laypage.html

2.example

1.引入JS和CSS文件

<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<script type="text/javascript" src="layui/layui.all.js"></script>
<!--这里换成你的路径-->

2.html代码

<div id="page"></div>

3.js代码

layui.use(['laypage', 'layer'], function(){
        var laypage = layui.laypage
         laypage.render({
            elem: 'page', //填你DIV的ID
            theme: '#6699ff', //颜色
            limit:10, //一页的条数，默认为10
            count: 100, //数据总数
            //触发换页操作
            jump: function(obj){                
                console.log("code you code");       
            }
        });
    });