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));
         }
     });
 }