如何在没有 jquery 的情况下实现 bootstrap 5 分页答案

【问题标题】：How to implement bootstrap 5 pagination without jquery如何在没有 jquery 的情况下实现 bootstrap 5 分页
【发布时间】：2021-12-05 06:58:56
【问题描述】：

我正在尝试使用 bootstrap 5 为卡片实现分页，我在这里关注..https://getbootstrap.com/docs/5.0/components/pagination/

我只能找到 UI，但我没有看到任何使用真实数据的适当实现，是否有任何适当的实现可用？（具有页面长度、搜索等功能）

【问题讨论】：

标签： html css pagination bootstrap-5

【解决方案1】：

Bootstrap 5 通常在没有 jQuery 的情况下运行，即使您可以再次添加它。但是你不需要 jQuery（就像 Bootstrap 4 一样）。

见https://getbootstrap.com/docs/5.0/getting-started/javascript/

Bootstrap 5 设计为不使用 jQuery，但仍然可以使用我们的组件与 jQuery。

关于你的问题：

使用分页组件根本不需要任何 javascript。为了更清楚，我将https://www.example.org/ 作为链接hrefs 插入到虚拟代码中，只需在此处插入您的链接。

见https://getbootstrap.com/docs/5.0/components/pagination/#overview

只需在编写#的示例代码中插入正确的链接href。

<nav aria-label="Page navigation example">
  <ul class="pagination">
    <li class="page-item"><a class="page-link" href="https://www.example.org/">Previous</a></li>
    <li class="page-item"><a class="page-link" href="https://www.example.org/">1</a></li>
    <li class="page-item"><a class="page-link" href="https://www.example.org/">2</a></li>
    <li class="page-item"><a class="page-link" href="https://www.example.org/">3</a></li>
    <li class="page-item"><a class="page-link" href="https://www.example.org/">Next</a></li>
  </ul>
</nav>

如果您正在搜索一个实际的逻辑实现，它使您的数据实际上被分页，那根本不包含在引导程序中。 Bootstrap 仅提供 GUI，而不是您需要使数据实际分页的服务器端逻辑。

【讨论】：