javascript - jQuery TWBS 分页实现

标签 javascript jquery html ajax pagination

我是分页插件的新手,现在我决定使用 jQuery TWBS 分页插件。

我看到了不同的教程,但实际上我无法找到如何将数据提取到该插件并设置我想在每页显示的适当数量的 div。 我的 html 看起来像这样:

<div class="wrapper">
  <div class="container">
    <div class="row">
      <div class="col-sm-12">
        <ul id="pagination-demo" class="pagination-sm"></ul>
      </div>
    </div>
    <div id="page-content" class="page-content">
         <div class="content">Some text</div>
         <div class="content">Some text</div>
         <div class="content">Some text</div>
         <div class="content">Some text</div>
         <div class="content">Some text</div>
    </div>
  </div>
</div>

而JS应该是这样的:

$('#pagination-demo').twbsPagination({
        totalPages: 2,
        next: 'Next',
        prev: 'Prev',
        onPageClick: function (event, page) {
            //fetch content and render here
            $('#page-content').text('Page ' + page) + ' content here';
        }
    });

我无法理解如何将带有“content”类名称的 div 提取到此 onPageClick 函数,并且每页仅显示 4 个 div。

我知道这很容易,但我自己做不到。请帮忙。

最佳答案

根据 Docs ,

twbsPagination 插件不支持 itemOnPage

对于替代分页方法,他们建议使用 flaviusmatis/simplePagination.js

希望这对您有所帮助!

关于javascript - jQuery TWBS 分页实现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44662871/

相关文章:

javascript - 从 jQuery 中的 href 标签加载 div 中的内容

html - 如何在浏览器中显示 <tag>?

jQuery - 如何按属性名称开头选择值

javascript - 向下滚动页面,然后使用 jQuery 向上滚动

javascript - 如何在java中使用行分隔2个输出数据

javascript - 用mysql比较两个表

javascript - 禁用 iframe 文本区域

javascript - 在新打开的窗口中打开另存为对话框

javascript - 无法让简单的 text_area 字符计数器工作

javascript - waypoint.js 在第二部分不起作用