分页demo

1.引入page_common.css和page_common.js。文件见个人码云:https://gitee.com/morningworld/codes/kbufi7vqsxl461oj8med237

2.为分页分配一个区域，我这里用一个块放入这个分页块

<div class="page-get center">
                <div id="page_s1" class="page_s1">
                </div>
            </div>

page_s1就是我们的分页。

3.js代码分配功能：

function loadPage() { //加载下方的分页
        // 初始化 分页
        let page_s1 = createPage('.page_s1');
        //此处进行一个ajax请求,得到数据总条数
        let _pageTotal = 11;
        setPage(page_s1, {
            pageTotal: _pageTotal, // 数据总条数   
            pageSize: 5, // 每页显示条数
            pageCurrent: 1, //  当前页
            maxBtnNum: 5, // 最多按钮个数  （最少5个）
            change: function(e) { // 页数变化回调函数（返回当前页码）
                var a = e;
                //点击的时候请求某一页的数据,并加载到页面上
                var index = layer.load(0, {
                    shade: false
                });
                setTimeout(function() { //模拟数据请求
                    let problems = ["第2页-什么是GI", "第2页-影响GI的因素有哪些", "第2页-如何测试GI", "为什么选择低GI饮食", "什么是胰岛素指数"];
                    let texts = ["第2页-GI是***", "第2页-影响GI的因素有很多", "第2页-方法1加方法2", "第2页-选择低GI饮食"];
                    layer.close(index);
                    loadProblems(problems, texts);
                }, 500)
            },
        })
    }