SOURCE

console 命令行工具 X clear

                    
>
console
var $container = $("#pagination");
var $advancedCon = $("#testAdvancedCon");
var $simpleCon = $("#testSimpleCon");
var $advancedExample = $("#advancedExample");
var $simpleExample = $("#simpleExample");

var pagesize = 5;
testAdvanced(1, pagesize);
testSimple(1, pagesize);

function testAdvanced(pagenum, pagesize) {
    var textDom = '';

    var firstIndex = (pagenum - 1) * pagesize;
    for (var i = firstIndex; i < pagenum * pagesize; i++) {
        var singleDom = '<div class="testAdvanced">' + i + '</div>';
        textDom += singleDom;
    }
    $advancedCon.html(textDom);
    $advancedExample.pagination({
        mode: 'advanced', //可选, 分页的模式
        pagesize: pagesize, //可选, 一页展示的数据
        pageSizeOptions: [5, 10, 50, 100], //可选,下拉框里面的数据
        selectedIndex: 0, //可选,下拉框的默认显示的index
        pagenum: pagenum, //可选,当前的页码
        totalSize: 1000 //必填,总共多少条数据
    });
}

function testSimple(pagenum, pagesize) {
    var textDom = '';
    var firstIndex = (pagenum - 1) * pagesize;
    for (var i = firstIndex; i < pagenum * pagesize; i++) {
        var singleDom = '<div class="testSimple">' + i + '</div>';
        textDom += singleDom;
    }
    $simpleCon.html(textDom);
    $simpleExample.pagination({
        mode: 'simple', //可选, 分页的模式
        pagesize: pagesize, //可选, 一页展示的数据
        pagenum: pagenum, //可选,当前的页码
        totalSize: 1000, //必填,总共多少条数据
        pagerButtonsCount: 3
    });
}

$advancedExample.off('pagersearch').on('pagersearch', function(e, pagenum, pagesize, total) {
    testAdvanced(pagenum, pagesize); //这个方法必须是渲染数据的方法
});
$simpleExample.off('pagersearch').on('pagersearch', function(e, pagenum, pagesize, total) {
    testSimple(pagenum, pagesize); //这个方法必须是渲染数据的方法
});
<div class="bh-mb-16">
    <div id="testAdvancedCon" class="bh-mb-16"></div>
    <div class="" id="advancedExample"></div>
</div>
<div>
    <div id="testSimpleCon" class="bh-mb-16"></div>
    <div class="" id="simpleExample"></div>
</div>