bootstrap分页小部件

bootstrap分页小部件源码下载

看看谁在用

查看文件目录结构

文件大小:0.00M

素材分类:插件-其它前端代码

更新时间:2022-07-15

一个简单、轻量级、高度可定制的分页库,可与最新的Bootstrap5框架配合使用。

首先要创意一个容器
<div id="pagination"></div>
需要分页的条目
const items = [
      "item 1",
      "item 2",
      "item 3",
      // ...
];
初始化
const pagination = easyPagination({
      // items
      items,
      // number of items per page
      rows: 5,
      // pagination container
      buttonsWrapper: "#pagination",
      // handle items here
      handlePaginatedItems: (items) => {
        const list = document.getElementById("list");
        list.innerHTML = "";
        items.forEach((item) => {
          list.innerHTML += `<li class="list-group-item">${item}</li>`;
        });
      }
});
在刚刚创建的分页里显示分页按钮
pagination.paginate();
还可以自定义样式
const pagination = easyPagination({
      buttonClass: "page-link",
      nextClass: "page-link",
      prevClass: "page-link",
      nextText: "next >",
      prevText: "< prev",
      activeClass: "active",
});
更新分页数字
pagination.changeRows(20);
更新条目
pagination.changeItems(newItems);
上一页和下一页
pagination.next();
pagination.prev();

bootstrap分页小部件

正在加载文件目录...

阿部 下载了 此素材
下载了 此素材
庸了个白 下载了 此素材
君未央 下载了 此素材
鹤鱼 下载了 此素材
抖拉 下载了 此素材
一丨丿丶灬杰 下载了 此素材
莫慌 下载了 此素材
hobo 下载了 此素材
Sampson Y.H.Tseng 下载了 此素材

也许你还喜欢

  1. Bootstrap创意CSS3过渡效果按钮美化插件
  2. bootstrap和jquery表格头固定位置插件
  3. Bootstrap风格jQuery计算器插件
  4. Bootstrap美化垂直手风琴菜单插件
  5. Bootstrap输入框回车生成标签带删除插件
  6. 精美Bootstrap网格图文卡片布局插件
  7. jquery bootstrap导航菜单插件
  8. jquery bootstrap垂直导航菜单栏收缩效果
JavaScript+SVG生成二维码
  • 标签查找|关于我们|用户协议|格式化工具|bootstrapmb.com 版权所有 苏ICP备20015882号-5
  • 背景样式编辑器|按钮样式编辑器|背景动效编辑器|图片布局编辑器