page.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. function page_ctrl(data_obj) {
  2. //分页元素
  3. var obj_box = (data_obj.obj_box !== undefined) ? data_obj.obj_box : function() { return; };
  4. //总共数据条数
  5. var total_item = (data_obj.total_item !== undefined) ? parseInt(data_obj.total_item) : 0;
  6. //每页显示数据条数
  7. var per_num = (data_obj.per_num !== undefined) ? parseInt(data_obj.per_num) : 5;
  8. //当前页数
  9. var current_page = (data_obj.current_page !== undefined) ? parseInt(data_obj.current_page) : 1;
  10. //总页数
  11. var total_page = Math.ceil(total_item / per_num);
  12. // if (total_page < 2) { return; }
  13. //插入放数据的div
  14. $(obj_box).html('<div class="page_content"></div>');
  15. //插入放页码的div
  16. $(obj_box).html('<div class="page_ctrl"></div>');
  17. $('.page_activitiesPage').css({display:'none'}); //首次进入隐藏翻页组件
  18. function page_even() {
  19. //只能传达数字
  20. var regPos = /^\d+$/;
  21. //如果当前页数不是数字
  22. if (regPos.test(current_page)) {
  23. current_page = current_page < 1 ? 1 : (current_page > total_page ? total_page : current_page);
  24. } else {
  25. current_page = 1;
  26. }
  27. //调用 回调函数
  28. data_obj.change_content(per_num, current_page);
  29. var inp_val = (current_page == total_page) ? 1 : current_page;
  30. //分页div前半部分
  31. var append_html = '<span class="page_total">共 ' + total_page + ' 页</span><button class="iconfont icon-xiangzuo prev_page"></button>';
  32. //页码数量
  33. for (var i = 0; i < total_page - 1; i++) {
  34. if (total_page > 8 && current_page > 6 && i < current_page - 3) {
  35. if (i < 2) {
  36. append_html += '<button class="page_num">' + (i + 1) + '</button>';
  37. } else if (i == 2) {
  38. append_html += '<span class="page_dot">...</span>';
  39. }
  40. } else if (total_page > 8 && current_page < total_page - 3 && i > current_page + 1) {
  41. if (current_page > 6 && i == current_page + 2) {
  42. append_html += '<span class="page_dot">...</span>';
  43. } else if (current_page < 7) {
  44. if (i < 8) {
  45. append_html += '<button class="page_num">' + (i + 1) + '</button>';
  46. } else if (i == 8) {
  47. append_html += '<span class="page_dot">...</span>';
  48. }
  49. }
  50. } else {
  51. if (i == current_page - 1) {
  52. append_html += '<button class="page_num current_page">' + (i + 1) + '</button>';
  53. } else {
  54. append_html += '<button class="page_num">' + (i + 1) + '</button>';
  55. }
  56. }
  57. }
  58. //生成最后一页
  59. if (current_page == total_page) {
  60. append_html += '<button class="page_num current_page">' + (i + 1) + '</button>';
  61. } else {
  62. append_html += '<button class="page_num">' + (i + 1) + '</button>';
  63. }
  64. //分页div后半部分
  65. append_html += '<button class="iconfont icon-xiangyou next_page"></button><span class="page_total">到第</span><input class="input_page_num" type="text" ><span class="page_text">页</span><button class="to_page_num">确定</button>';
  66. $(obj_box).children('.page_ctrl').append(append_html);
  67. //左右分页按钮监控
  68. if (current_page == 1) {
  69. $(obj_box + ' .page_ctrl .prev_page').attr('disabled', 'disabled').addClass('btn_dis');
  70. } else {
  71. $(obj_box + ' .page_ctrl .prev_page').removeAttr('disabled').removeClass('btn_dis');
  72. }
  73. if (current_page == total_page) {
  74. $(obj_box + ' .page_ctrl .next_page').attr('disabled', 'disabled').addClass('btn_dis');
  75. } else {
  76. $(obj_box + ' .page_ctrl .next_page').removeAttr('disabled').removeClass('btn_dis');
  77. }
  78. };
  79. page_even();
  80. //给按钮绑定点击事件
  81. $(obj_box + ' .page_ctrl').on('click', 'button', function() {
  82. var that = $(this);
  83. if (that.hasClass('prev_page')) {
  84. if (current_page != 1) {
  85. current_page--;
  86. that.parent('.page_ctrl').html('');
  87. page_even();
  88. }
  89. } else if (that.hasClass('next_page')) {
  90. if (current_page != total_page) {
  91. current_page++;
  92. that.parent('.page_ctrl').html('');
  93. page_even();
  94. }
  95. } else if (that.hasClass('page_num') && !that.hasClass('current_page')) {
  96. current_page = parseInt(that.html());
  97. that.parent('.page_ctrl').html('');
  98. page_even();
  99. } else if (that.hasClass('to_page_num')) {
  100. current_page = parseInt(that.siblings('.input_page_num').val());
  101. that.parent('.page_ctrl').html('');
  102. page_even();
  103. }
  104. });
  105. }