test.html 1.4 KB
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>laypage Demo</title>
        <link rel="stylesheet" href="/layui/css/layui.css" media="all">
        <script src="/layui/layui.js" charset="utf-8"></script>
    </head>
    <body>
        <div id="laypage"></div>
        <ul id="city_list"></ul>
        <script>
            layui.use(['laypage', 'layer','jquery'], function () {
                let laypage = layui.laypage;
                let $ = layui.jquery;
                //调用分页
                laypage.render({
                    elem: 'laypage', // 存放分页控件的容器
                    count: 2, //数据总数。一般通过服务端得到
                    limit: 1,//每页显示的条数。laypage将会借助 count 和 limit 计算出分页数。
                    layout: ['prev', 'page', 'next', 'limit', 'limits'],
                    theme: '#F457F2', //自定义主题
                    jump: function (obj) {
                      $.post('/equipment/manage/list',{},function(res){
                          var html='';
                          $.each(res.data,function(index,item){
                              html += '<li>'+item.name+'</li>';
                          });
                          $('#city_list').html(html);
                      });
                    }
                });
            });
        </script>
    </body>
</html>