分页

这是针对于一个曾经做过的具体项目写的一个分页,不一定适用于每一种项目,但确实提供了一种思路,这是需要后台配合来完成的分页。

params_data主要需包含以下内容

params_data = {

  page:1,

  num:10

}


// 分页函数
function list_table_render_pagination(pag_block_class, params_data, get_list_fun, total_count, item_count, param_url) {
// config
var pagination_block_class = pag_block_class + ' ';
var top_class = pagination_block_class;
var _params = params_data;
var _get_list = get_list_fun;

// end config
total_count = parseInt(total_count);
var page = parseInt(_params['page']);
var numOld = (_params['num']) ? (_params['num']) : (_params['limit']);
var num = parseInt(numOld);

var total_page_count = Math.ceil(total_count / num);
$(top_class + '.select_list li').unbind('click').bind('click', function () {
$(this).parent().parent().children(".select_input").val($(this).text());
_params['num'] = $(this).text();
_params['limit'] = $(this).text();
_params['page'] = 1;
_get_list(param_url);
});
//如果第一页则disable首页和上一页
if (page == 1 && total_page_count == 1) {
$(top_class + '.fenye_btn').eq(0).removeClass('first_page_valid').addClass('first_page_invalid');
$(top_class + '.fenye_btn').eq(1).removeClass('prev_page_valid').addClass('prev_page_invalid');
$(top_class + '.fenye_btn').eq(2).removeClass('next_page_valid').addClass('next_page_invalid');
$(top_class + '.fenye_btn').eq(3).removeClass('last_page_valid').addClass('last_page_invalid');
} else if (page == 1) {
$(top_class + '.fenye_btn').eq(0).removeClass('first_page_valid').addClass('first_page_invalid');
$(top_class + '.fenye_btn').eq(1).removeClass('prev_page_valid').addClass('prev_page_invalid');
$(top_class + '.fenye_btn').eq(2).removeClass('next_page_invalid').addClass('next_page_valid');
$(top_class + '.fenye_btn').eq(3).removeClass('last_page_invalid').addClass('last_page_valid');
} else if (page == total_page_count) {
$(top_class + '.fenye_btn').eq(0).removeClass('first_page_invalid').addClass('first_page_valid');
$(top_class + '.fenye_btn').eq(1).removeClass('prev_page_invalid').addClass('prev_page_valid');
$(top_class + '.fenye_btn').eq(2).removeClass('next_page_valid').addClass('next_page_invalid');
$(top_class + '.fenye_btn').eq(3).removeClass('last_page_valid').addClass('last_page_invalid');
} else {
$(top_class + '.fenye_btn').eq(0).removeClass('first_page_invalid').addClass('first_page_valid');
$(top_class + '.fenye_btn').eq(1).removeClass('prev_page_invalid').addClass('prev_page_valid');
$(top_class + '.fenye_btn').eq(2).removeClass('next_page_invalid').addClass('next_page_valid');
$(top_class + '.fenye_btn').eq(3).removeClass('last_page_invalid').addClass('last_page_valid');
}

if (total_page_count >= 4 && page >= 3) {
if (total_page_count - page >= 2) {
$(top_class + '.page_box').eq(0).text(page - 1).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(1).text(page).css('display', 'inline-block').addClass('on');
$(top_class + '.page_box').eq(2).text(page + 1).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(3).text(page + 2).css('display', 'inline-block').removeClass('on');
} else if (total_page_count - page == 1) {
$(top_class + '.page_box').eq(0).text(page - 2).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(1).text(page - 1).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(2).text(page).css('display', 'inline-block').addClass('on');
$(top_class + '.page_box').eq(3).text(page + 1).css('display', 'inline-block').removeClass('on');

} else if (total_page_count - page == 0) {
$(top_class + '.page_box').eq(0).text(page - 3).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(1).text(page - 2).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(2).text(page - 1).css('display', 'inline-block').removeClass('on');
$(top_class + '.page_box').eq(3).text(page).css('display', 'inline-block').addClass('on');

}
} else {
for (var i = 1; i <= total_page_count; i++) {
$(top_class + '.page_box').eq(i - 1).text(i).css('display', 'inline-block').removeClass('on');
}
for (; i <= 4; i++) {
$(top_class + '.page_box').eq(i - 1).css('display', 'none').removeClass('on');
}
$(top_class + '.page_box').eq(page - 1).addClass('on');
}
$(top_class + '.f_color.mLR_5:eq(0)').text(item_count);
$(top_class + '.f_color.mLR_5:eq(1)').text(total_page_count);
$(top_class + '.fenye_btn').eq(0).unbind('click').bind('click', function () {
_params['page'] = 1;
_get_list(param_url);
});
$(top_class + '.fenye_btn').eq(1).unbind('click').bind('click', function () {
_params['page'] = page == 1 ? 1 : page - 1;
_get_list(param_url);
});
$(top_class + '.fenye_btn').eq(2).unbind('click').bind('click', function () {
_params['page'] = page == total_page_count ? total_page_count : page + 1;
_get_list(param_url);
});
$(top_class + '.fenye_btn').eq(3).unbind('click').bind('click', function () {
_params['page'] = total_page_count;
_get_list(param_url);
});
$(top_class + '.page_box').unbind('click').bind('click', function () {
var page = $(this).text();
if (page == '...') {
return;
}
_params['page'] = page;
_get_list(param_url);
return false;
});
}

author:Lik
Endeavoring to powerless, struggling to move yourself.
原文地址:https://www.cnblogs.com/likwin/p/7041602.html