分页插件 jquery.pagination.js

引用

<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<link rel="stylesheet" href="librarys/fenye/pagination.css">
<script src="librarys/fenye/jquery.pagination.js"></script>

html

<div class="nav">

</div>

css

.nav{
     text-align: center;
     padding: 0 1rem;
}
.nav a{
    color: #C8C8C8;
    border:1px solid #C8C8C8;
    display: inline-block;
    padding: 0.2rem 0.4rem;
    line-height: 1rem;
    text-align:center;
    margin:0.1rem 0.1rem;
    text-decoration: none !important;
}

js

// 分页
$('.nav').pagination({
    pageCount:10, //总页数
    coping: true, //开启首页末页
    homePage: '首页',
    endPage: '末页',
    prevContent: '上页',
    nextContent: '下页',
    callback:function(index){                            //实现功能的回调

        page = parseInt($('.nav span').html())               //获取被选中页数的值
        if(page==1){
             $('.list ul').empty()
             getlist()                                          //重新获取数据
        }else{
             $('.list ul li').hide()
             getlist()
        }
    }
})