前端分页插件twbsPagination(非AJAX)

2018-08-30  本文已影响0人  BrightHeart

1. 引入twbsPagination的js

<!--版本不要太新-->
<script src="/plugins/page/jquery.twbsPagination.min.js"></script>

2. Table下加入分页区域,使用BootStrap样式

<!--使用BootStrap样式-->
<div class="box-footer">
         <ul id="pagination-demo" class="pagination pull-right"></ul>
</div>

3. 书写twbsPagination的js

 $(function () {
        $("#pagination-demo").twbsPagination({
            totalPages:[[${pageInfo.pages}]],  //总页数
            hideOnlyOnePage: true,  //当总数为一页时,不显示分页
            visiblePages:7,  //设置最多显示的页码数(例如有20页,当前第1页,则显示1 - 7页)
            currentPage:[[${pageInfo.pageNum}]],  //设置当前的页码
            first:'首页',
            last:'末页',
            prev:'上一页',
            next:'下一页',
            href:"/bug/myNote?pageNum={{number}}"
        })
    })
上一篇下一篇

猜你喜欢

热点阅读