分页插件jqPaginator

本文通过一个简单的小demo,介绍如何使用jqPaginator这个轻量级的分页插件,包括初始化和销毁分页的功能。

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


之前的分页功能一直都是自己写,一天偶然看到网友分享的jqPaginator。

看了一下确实非常轻便,就写了一个小demo,在这里分享出来,跟各位一起学习

具体步骤:

1.引入JQ跟 jqpaginator.js
2.html中添加容器
<div id="idname"></div>
3.初始化分页:
$.jqPaginator('#idname', {
        totalPages: 10,
        visiblePages: 4,
        currentPage: 3,
        first: '<li class="first"><a href="javascript:;">first</a></li>',
        prev: '<li class="prev"><a href="javascript:;">Previous</a></li>',
        next: '<li class="next"><a href="javascript:;">Next</a></li>',
        page: '<li class="page"><a href="javascript:;">{{page}}</a></li>',
        last: '<li class="last"><a href="javascript:;">last</a></li>',
       //num为当前页码,type为当前状态,分为“init”(初始化),“change”(点击分页)
        onPageChange: function (num, type) {
            $('#p2').text(type + ':' + num);
        }
    });

扩展方法:
jqPaginator提供了两个扩展方法,方便 初始化后 对组件进行操作。
1. $('#id').jqPaginator('option', options) 初始化后,动态修改配置

$('#id').jqPaginator('option', {
    currentPage: 1
});

2.$('#id').jqPaginator('destroy')销毁jqPaginator

$('#id').jqPaginator('destroy');






评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值