Js 简单分页（二）

此次使用了http://www.purecss.org/ 的前端Css

效果图

　　

上代码

//更新分页工具栏的效果展示
function updatepagetoolshow(){
    //判断当前页 及 总页数
    if(curpage == 1 && totalpage == 1)
    {
        //设置跳转按钮 不可点
        $("#pagetool .turn").addClass("pure-button-disabled");
    }
    else if(curpage == 1){
        //设置向前按钮不可点
        $("#pagetool .before").addClass("pure-button-disabled");
    }
    else if(curpage == totalpage)
    {
        //设置向后按钮不可点
        $("#pagetool .after").addClass("pure-button-disabled");
    }
    //设置当前页
    $("#topage").val(curpage);
}
//更新主体显示部分 （分页显示内容）
function updatelist(){
    var jsonParam = {
            curpage:curpage,//当前页
            pageitems:pageitems,//当前页条目数
            sortby:sortby,//按 什么 排序
            order:order//排序方式 升序 or 降序
        };
    $.ajax({
        type: "post",
        url: "url",//请求处理地址
        contentType: "application/json",//请求参数传输格式
        data: jsonParam,//参数
        dataType: "json",
        success: function (result) {
            //总条目数、总页数更新
            $("#totalItems").html(result.totalItems);
            $("#totalPage").html(result.totalPage);
            totalpage = result.totalPage;

            /*******更新主体内容显示********
            ********your own code***********
            *******************************/

            //更新分页显示
            $("#pagetool .turn").removeClass("pure-button-disabled");
            updatepagetoolshow();
        },
        error: function (result) {
            alert("error:" + JSON.stringify(result));
        }
    });
}