jq分页插件

jq分页插件

http://www.zhangxinxu.com/jq/pagination_zh/

html

---------------

<tbody id="hiddenresult" style=" display:none;">  <tr>  <td>5</td><td>333</td>  <td >  <span style=" color:#e5b612">送审</span>  <span> 工作人员1</span>  </td>  <td><span class="redtag">5王某某　　送审　　工作人员1</span></td>  <td>2014-06-26 09:26</td>  </tr>

</tbody>

 <tbody id="Searchresult"></tbody>

<div id="Pagination" class="pagination"><!-- 这里显示分页 --></div>


js
----------------------------------------------

<script type="text/javascript">  $(function () {  //这是一个非常简单的demo实例，让列表元素分页显示  //回调函数的作用是显示对应分页的列表项内容  //回调函数在用户每次点击分页链接的时候执行  //参数page_index{int整型}表示当前的索引页   var iPageSize = 5;  var rowsLength = $("#hiddenresult tr").length;   var initPagination = function () {  var num_entries = rowsLength;  // 创建分页  $("#Pagination").pagination(num_entries, {  num_edge_entries: 1, //边缘页数  num_display_entries: parseInt(num_entries / iPageSize), //主体页数  callback: pageselectCallback,  items_per_page: iPageSize //每页显示几项  });  } ();   function pageselectCallback(page_index, jq) {  // 从表单获取每页的显示的列表项数目  var max_elem = Math.min((page_index + 1) * iPageSize, rowsLength);  $("#Searchresult").html("");  // 获取加载元素  for (var i = page_index * iPageSize; i < max_elem; i++) {  var new_content = $("#hiddenresult tr:eq(" + i + ")").clone();  $("#Searchresult").append(new_content); //装载对应分页的内容  }  //阻止单击事件  return false;  }     }); </script>