关于jqPage分页插件使用方法

时间:2023-01-10 22:38:25

//分页 需要分页的时候调用该方法即可
function setPage(data){
var pageNo=0;//初始值
var PageCount=data.page.totalCount;//总条数
var pageSize=data.page.pageSize;//每页显示的条数
$("#Pagination").pagination(PageCount, {
callback: PageCallback,
prev_text: '上一页', //上一页按钮里text
next_text: '下一页', //下一页按钮里text
items_per_page: pageSize, //显示条数
num_display_entries: 6, //连续分页主体部分分页条目数
current_page: pageNo, //当前页索引
num_edge_entries: 2 //两侧首尾分页条目数
});

//翻页调用
function PageCallback(page_id, jq) {
InitTable(page_id);
}
//请求数据
function InitTable(pageNo) {
$.ajax({
type: "POST",
dataType: "JSON",
url: '需要请求的URL?pageNo='+(pageNo+1)+"&pageSize="+pageSize,
data: $('#basicInformationForm').serialize(),
success: function (data) {
$.each(data.obj, function(i, item) {
/*
* setbasicInformation(item);
*
* 添加内容数据,分页插件里面有对应的条件查询,可根据回车键跳转到指定页或点击GO跳转到指定页
* */
});
}
});
}
}
/*
* 分页插件的对的CSS
*
#Pagination{padding:15px atuo;text-align:right;color: #ccc;width:60%;float:right;display:inline-block;}
#Pagination a{display: inline-block;color: #428bca;display: inline-block;height: 25px; line-height: 25px; padding: 0 10px;border: 1px solid #ddd; margin: 0 2px;border-radius: 4px;vertical-align: middle;}
#Pagination a:hover{text-decoration: none;border: 1px solid #428bca;}
#Pagination span.current{display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px;color: #fff;background-color: #428bca; border: 1px solid #428bca;border-radius: 4px;vertical-align: middle;}
#Pagination span.disabled{display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px; color: #bfbfbf;background: #f2f2f2;border: 1px solid #bfbfbf;border-radius: 4px;vertical-align: middle;}
.page_num{color:#F33;border:1px solid #ccc;height:25px;line-height:25px;border-radius:5px;text-align:center;}
#Pagination label span{color:#428bca;}
#goPage{margin-left:10px;width:35px;border-radius:5px;height:25px;line-height:25px;border:1px solid #428bca;color:#fff;background:#428bca;cursor:pointer;} 选择GO跳转的时候需要改CSS,否则不需要
*
*/