本文共 2424 字，大约阅读时间需要 8 分钟。

html:

<link href="~/Content/layui/css/layui.css" rel="stylesheet" /><div id="test1"></div><ul id="biuuu_city_list"></ul><script src="~/Content/layui/layui.js"></script>

js:

<script>    layui.use('laypage', function () {
           var laypage = layui.laypage;        var data = [            '北京',            '上海',            '广州',            '深圳',            '杭州',            '长沙',            '合肥',            '宁夏',            '成都',            '西安',            '南昌',            '上饶',            '沈阳',            '济南',            '厦门',            '福州',            '九江',            '宜春',            '赣州',            '宁波',            '绍兴',            '无锡',            '苏州',            '徐州',            '东莞',            '佛山',            '中山',            '成都',            '武汉',            '青岛',            '天津',            '重庆',            '南京',            '九江',            '香港',            '澳门',            '台北'        ];        //执行一个laypage实例        laypage.render({
               elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号            , count: data.length-1 //数据总数，从服务端得到            , theme: '#062EFB'  //自定义主题。支持传入：颜色值，或任意普通字符  theme: 'xxx' /            , hash: 'fenye' //自定义hash值            , limits: [14, 30, 20, 10, 60]//每页条数的选择项。如果 layout 参数开启了 limit，则会出现每页条数的select选择框            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']            , groups: 5            , jump: function (obj, first) {
                   //obj包含了当前分页的所有参数，比如：               // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。                //console.log(obj.limit); //得到每页显示的条数                //模拟渲染                document.getElementById('biuuu_city_list').innerHTML = function () {
                       var arr = []                        , thisData = data.concat().splice(obj.curr * obj.limit - obj.limit, obj.limit);                    console.log(data);                    console.log(obj.curr * obj.limit - obj.limit);                    console.log( obj.limit);                    console.log(thisData);                    layui.each(thisData, function (index, item) {
                           console.log(index, item);                        arr.push('<li>' + item + '</li>');                    });                    return arr.join('');                }();                //首次不执行                if (!first) {
                       //do something                }            }        });    });</script>

效果：