Skip to content

Latest commit

 

History

History
62 lines (55 loc) · 1.86 KB

README.md

File metadata and controls

62 lines (55 loc) · 1.86 KB

sPage

jquery分页插件

1,引入样式文件,可以根据实际需要修改插件样式
<link rel="stylesheet" type="text/css" href="./jquery.sPage.css">

2,引入jQuery.js文件
<script src="./jquery.min.js"></script>

3,引入sPage插件
<script src="./jquery.sPage.min.js"></script>

4,参数说明和使用示例

参数 默认值 备注
page 必填 当前页码
total 必填 数据总条数
pageSize 10 每页显示多少条数据
totalTxt 共{total}条 数据总条数文字描述,{total}为占位符,默认"共{total}条"
noData false 没有数据时是否显示分页,默认false不显示,true显示第一页
showTotal false 显示总条数
showSkip false 显示跳页
showPN true 显示上下翻页按钮
prevPage 上一页 上翻页文字描述
nextPage 下一页 下翻页文字描述
fastForward 0 快进快退页数,0表示不开启快进快退
backFun 点击分页按钮回调函数,返回当前页码
// ajax调用实例
function ajaxPage(page){
    var p = page || 1;
    $.ajax({
        type: "POST",
        url: "https://www.test.com/test",
        data: {
            page:p,
            pageSize:10
        },
        dataType: "json",  
        success: function(data){
            //数据处理
            // ...

            // 调用分页插件
            $("#myPage").sPage({
                page:p,//当前页码
                pageSize:10,//每页显示多少条数据,默认10条
                total:data.total,//数据总条数,后台返回
                backFun:function(page){
                    //点击分页按钮回调函数,返回当前页码
                    ajaxPage(page);
                }
            });
        },
        error:function(e){
            console.log(e);
        }
    });
}