【问题标题】:how to use pagination in bootstrap如何在引导程序中使用分页
【发布时间】:2017-05-03 14:25:16
【问题描述】:

我正在使用下面的代码进行分页,这是我从这个链接获得的。 http://botmonster.com/jquery-bootpag/#.V5qvJ-0sjVM 但它对我不起作用。

<html>
<head>
    <script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script src="//raw.github.com/botmonster/jquery-bootpag/master/lib/jquery.bootpag.min.js"></script>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
</head>
<body>
    <div id="content">Dynamic Content goes here</div>
    <div id="page-selection">Pagination goes here</div>
    <script>
        // init bootpag
        $('#page-selection').bootpag({
            total: 10
        }).on("page", function(event, /* page number here */ num){
             $("#content").html("Insert content"); // some ajax content loading...
        });
    </script>
</body>
</html>

我是 jquery 的新手。请检查一次,让我知道我正在做的错误。

谢谢。

【问题讨论】:

  • 您收到什么错误?如果我们不知道发生了什么,人们将无法真正帮助您
  • 它在浏览器中只显示 2 行。\n"这里是动态内容分页在这里"\n.
  • 错误是:- TypeError: $(...).bootpag is not a function

标签: jquery twitter-bootstrap twitter-bootstrap-3 jquery-pagination


【解决方案1】:

问题是你不能直接从github链接jquery-bootpag JS文件。 将其本地上传到您的环境,或将链接更改为:

//rawgit.com/botmonster/jquery-bootpag/master/lib/jquery.bootpag.min.js,这样你的导入看起来像这样:

<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="//rawgit.com/botmonster/jquery-bootpag/master/lib/jquery.bootpag.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

【讨论】:

  • 正是问题所在!只需复制过去并在本地保存即可在本地下载jquery.bootpag.min.js
猜你喜欢
  • 1970-01-01
  • 2017-06-01
  • 2013-11-13
  • 2018-09-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多