文章目录

  1. 1. 1、获取项目
  2. 2. 2、使用项目
  3. 3. 3、使用
  4. 4. 4、细节
  5. 5. 5、问题解决
    1. 5.1. 5.1 无样式问题

Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。我们在实际项目的会根据我们的需求对Bootstrap进行功能扩展,以符合我们的开发需求。

1、获取项目

这是Bootstrap的一个分页插件,bootstrap-paginator。Bootstrap v3 现在已经支持。
主页:https://github.com/lyonlai/bootstrap-paginator

git clone git://github.com/lyonlai/bootstrap-paginator.git

2、使用项目

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

3、使用

var paginatorOptions = {
    currentPage: 1,
    totalPages: 5,
    numberOfPages: 5,
    size:"normal",
    alignment:"left",
      onPageClicked: function(e, originalEvent, type, page){
        var data = {
                    "url": url,
                    "data": {
                        startPage: page,
                        limit: limit
                }
};
$("#pageDiv").bootstrapPaginator(paginatorOptions);

4、细节

关于使用细节,可以参考该项目的中的documentation路径下的API文档。

5、问题解决

5.1 无样式问题

修改bootstrap-paginator.js里的:$(“<ul></ul>”) 改为:$(“<ul class=\”pagination\”></ul>”)

(完)

微信公众号

文章目录

  1. 1. 1、获取项目
  2. 2. 2、使用项目
  3. 3. 3、使用
  4. 4. 4、细节
  5. 5. 5、问题解决
    1. 5.1. 5.1 无样式问题