bootstrap 分页插件 bootstrap-paginator(百度云下载)

1.先导入相关的 bootstrap 、jquery、bootstrap-paginator 相关 css+js 文件,本文后面提供百度云下载链接。

<link rel="stylesheet" href="css/bootstrap.min.css" />
<script src="./js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="./js/bootstrap-paginator.js"></script>

2.在 body 标签里面写下以下代码:

<body>
<div style="text-align: right;">
    <ul id='bp-3-element-test'></ul>
</div>
<script type="text/javascript">

    $(function(){
        var element = $('#bp-3-element-test');
        var options = {
            bootstrapMajorVersion:3, //bootstrap的版本要求
            currentPage: 2,          //设置当前页
            numberOfPages: 5,		 //设置可以点击到的页数范围
            totalPages:11            //设置总页数
//          numberOfPages:5        //一页列出多少数据
        }
        element.bootstrapPaginator(options);
    });
</script>
</body>

3.这样就行了,项目使用,请自行修改一些动态参数。以下是效果图:


4.下面是提供整个 bootstrap 的分页插件代码的百度云链接,下载后可直接预览,已经整理过,可读性强。

链接: https://pan.baidu.com/s/114GSiHCX2xtrLRUk1yL6qw 密码: a2k9

猜你喜欢

转载自blog.csdn.net/weidong_y/article/details/79842787