jquery.pagination.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. /**
  2. * This jQuery plugin displays pagination links inside the selected elements.
  3. *
  4. * modify:将起始页由0变成1开始
  5. *
  6. * @author Gabriel Birke (birke *at* d-scribe *dot* de)
  7. * @version 1.2
  8. * @param {int} maxentries Number of entries to paginate
  9. * @param {Object} opts Several options (see README for documentation)
  10. * @return {Object} jQuery Object
  11. */
  12. jQuery.fn.pagination = function(maxentries, opts){
  13. opts = jQuery.extend({
  14. items_per_page:10,
  15. num_display_entries:10,
  16. current_page:0,
  17. num_edge_entries:0,
  18. link_to:"#",
  19. prev_text:"上一页",
  20. next_text:"下一页",
  21. ellipse_text:"...",
  22. prev_show_always:true,
  23. next_show_always:true,
  24. callback:function(){return false;}
  25. },opts||{});
  26. return this.each(function() {
  27. /**
  28. * 计算最大分页显示数目
  29. */
  30. function numPages() {
  31. return Math.ceil(maxentries/opts.items_per_page);
  32. }
  33. /**
  34. * 极端分页的起始和结束点,这取决于current_page 和 num_display_entries.
  35. * @返回 {数组(Array)}
  36. */
  37. function getInterval() {
  38. var ne_half = Math.ceil(opts.num_display_entries/2);
  39. var np = numPages();
  40. var upper_limit = np-opts.num_display_entries;
  41. var start = current_page>ne_half?Math.max(Math.min(current_page-ne_half, upper_limit), 0):0;
  42. var end = current_page>ne_half?Math.min(current_page+ne_half, np):Math.min(opts.num_display_entries, np);
  43. return [start,end];
  44. }
  45. /**
  46. * 分页链接事件处理函数
  47. * @参数 {int} page_id 为新页码
  48. */
  49. function pageSelected(page_id, evt){
  50. current_page = page_id;
  51. drawLinks();
  52. var continuePropagation = opts.callback(page_id, panel);
  53. if (!continuePropagation) {
  54. if (evt.stopPropagation) {
  55. evt.stopPropagation();
  56. }
  57. else {
  58. evt.cancelBubble = true;
  59. }
  60. }
  61. return continuePropagation;
  62. }
  63. /**
  64. * 此函数将分页链接插入到容器元素中
  65. */
  66. function drawLinks() {
  67. panel.empty();
  68. var interval = getInterval();
  69. var np = numPages();
  70. // 这个辅助函数返回一个处理函数调用有着正确page_id的pageSelected。
  71. var getClickHandler = function(page_id) {
  72. return function(evt){ return pageSelected(page_id,evt); }
  73. }
  74. //辅助函数用来产生一个单链接(如果不是当前页则产生span标签)
  75. var appendItem = function(page_id, appendopts){
  76. page_id = page_id<0?0:(page_id<np?page_id:np-1); // 规范page id值
  77. appendopts = jQuery.extend({text:page_id+1, classes:""}, appendopts||{});
  78. if(page_id == current_page-1){
  79. var lnk = jQuery("<li class='current'><a>"+(appendopts.text)+"</a></li>");
  80. }else{
  81. var lnk =jQuery("<li></lli>");
  82. var a_lnk = jQuery("<a>"+(appendopts.text)+"</a>")
  83. .bind("click", getClickHandler(page_id))
  84. .attr('href', opts.link_to.replace(/__id__/,page_id+1));
  85. lnk.append(a_lnk);
  86. }
  87. if(appendopts.classes){lnk.addClass(appendopts.classes);}
  88. panel.append(lnk);
  89. }
  90. // 产生"Previous"-链接
  91. if(opts.prev_text && (current_page > 1 || opts.prev_show_always)){
  92. appendItem(current_page-2,{text:opts.prev_text, classes:"prev"});
  93. }
  94. // 产生起始点
  95. if (interval[0] > 0 && opts.num_edge_entries > 0)
  96. {
  97. var end = Math.min(opts.num_edge_entries, interval[0]);
  98. for(var i=0; i<end; i++) {
  99. appendItem(i);
  100. }
  101. if(opts.num_edge_entries < interval[0] && opts.ellipse_text)
  102. {
  103. jQuery("<li class='disabled'><a href='#'>"+opts.ellipse_text+"</a></li>").appendTo(panel);
  104. }
  105. }
  106. // 产生内部的些链接
  107. for(var i=interval[0]; i<interval[1]; i++) {
  108. appendItem(i);
  109. }
  110. // 产生结束点
  111. if (interval[1] < np && opts.num_edge_entries > 0)
  112. {
  113. if(np-opts.num_edge_entries > interval[1]&& opts.ellipse_text)
  114. {
  115. jQuery("<li class='disabled'><a href='#'>"+opts.ellipse_text+"</a></li>").appendTo(panel);
  116. }
  117. var begin = Math.max(np-opts.num_edge_entries, interval[1]);
  118. for(var i=begin; i<np; i++) {
  119. appendItem(i);
  120. }
  121. }
  122. // 产生 "Next"-链接
  123. if(opts.next_text && (current_page < np || opts.next_show_always)){
  124. appendItem(current_page,{text:opts.next_text, classes:"next"});
  125. }
  126. }
  127. //从选项中提取current_page
  128. var current_page = opts.current_page;
  129. //创建一个显示条数和每页显示条数值
  130. maxentries = (!maxentries || maxentries < 0)?1:maxentries;
  131. opts.items_per_page = (!opts.items_per_page || opts.items_per_page < 0)?1:opts.items_per_page;
  132. //存储DOM元素,以方便从所有的内部结构中获取
  133. var panel = jQuery(this);
  134. // 获得附加功能的元素
  135. this.selectPage = function(page_id){ pageSelected(page_id);}
  136. this.prevPage = function(){
  137. if (current_page > 1) {
  138. pageSelected(current_page);
  139. return true;
  140. }
  141. else {
  142. return false;
  143. }
  144. }
  145. this.nextPage = function(){
  146. if(current_page < numPages()) {
  147. pageSelected(current_page);
  148. return true;
  149. }
  150. else {
  151. return false;
  152. }
  153. }
  154. // 所有初始化完成,绘制链接
  155. drawLinks();
  156. // 回调函数
  157. opts.callback(current_page, this);
  158. });
  159. }