Bootstrap Paginator 分页插件

深碍√TFBOYSˉ_ 2022-06-04 04:24 345阅读 0赞

**一、插件简介**

Bootstrap Paginator是一款基于Bootstrap和jQuery的分页组件。

github地址为: [ https://github.com/lyonlai/bootstrap-paginator][https_github.com_lyonlai_bootstrap-paginator]

中文介绍比较详细的: [https://my.oschina.net/shunshun/blog/204587][https_my.oschina.net_shunshun_blog_204587]

效果图如下:

![20171204160722382][]

**二、插件使用**

**1、下载源码**

下载最新的源码解压之后，如下:

![20171204160900580][]

**2、引入必要的css和js文件。**

**3、用一个div来展示**

**4、JS代码**

$('#pageLimit').bootstrapPaginator({    
        currentPage: 1,    
        totalPages: 10,    
        size:"normal",    
        bootstrapMajorVersion: 3,    
        alignment:"right",    
        numberOfPages:5,    
        itemTexts: function (type, page, current) {        
            switch (type) {            
            case "first": return "首页";            
            case "prev": return "上一页";            
            case "next": return "下一页";            
            case "last": return "末页";            
            case "page": return page;
            }
        }
    });

**5、效果如下**

![20171204161352576][]

[https_github.com_lyonlai_bootstrap-paginator]: https://github.com/lyonlai/bootstrap-paginator
[https_my.oschina.net_shunshun_blog_204587]: https://my.oschina.net/shunshun/blog/204587
[20171204160722382]: /images/20220604/19231d9d6823428a87a54b79ab821739.png
[20171204160900580]: /images/20220604/40e9819d12c4497ca9361faf8d67ec6d.png
[20171204161352576]: /images/20220604/a9c85a22385546b794e998650c2582ce.png