Pagination分页插件

Pagination.js

Pagination概述

• Pagination.js是一个基于Jquery的分页插件，所以在使用时必须先加载Jquery,而且自带样式pagination.css

引入相JS关文件

    <link rel="stylesheet" href="../css/pagination.css">
    <script src="../js/jquery-3.2.1.js"></script>
    <script src="../js/jquery.pagination.js"></script>

编写分页盒子(html)

//添加class必须是pagination才能匹配pagination.css的样式
    <div id="pagination" class="pagination"></div>

Js代码实现

 var total=60;//总条数
     var pageSize=10;//每页显示10条
     $("#pagination").pagination(total,{
        prev_text:"上一页",//上一页按钮文字，默认值为Perv
        next_text:"下一页",//下一页按钮文字,默认值为next
        num_edge_entries:2,两侧显示的首尾分页的条目数
        items_per_page:pageSize,//每页显示条数
        num_display_entries:5,连续分页主体部分显示的分页条目数
        callback:callback//回调
      });
     /**
      * 回调
      */
      function callback(index,jq) {
         initPage(index);//初始化页面
       }
      function initPage(index) {
         //请求数据
         $.ajax({
         url:basePath+"/admin/selectAllCate.html",
         type:"GET",
         success:function (response,status,xhr) {
           console.log(status);
         }
        });
      }