twbsPagination前端使用配置方法

最新推荐文章于 2023-07-02 16:50:23 发布

please stay cool

最新推荐文章于 2023-07-02 16:50:23 发布

阅读量353

点赞数

分类专栏：插件

本文链接：https://blog.youkuaiyun.com/yousacks/article/details/107311719

版权

插件专栏收录该内容

5 篇文章

订阅专栏

本文介绍如何利用TwbsPagination插件实现网页分页功能。通过引入jQuery和TwbsPagination的JS文件，在HTML中定义分页样式和结构，再在JS中配置参数如总页数、显示页数及导航文本等，即可轻松实现动态分页。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先引入jquery，twbspagination的js文件

在需要加按钮的地方加入：

<span style="font-size:14px;">
                            <div class="text-center">
                                <ul id="pagination-demo" class="pagination-sm"></ul>
                            </div>
                         </span>

在js中加入

$('#pagination-demo').twbsPagination({
        //total总记录数，就是多少条数据  pages总页数
        totalPages: ${list.pageInfo.pages},
        visiblePages: 1,
        first:'首页',
        last:'末页',
        prev:'上一页',
        next:'下一页',
        href:"list?pageNum={{number}}"
    });