分页

<div style="text-align:center">
    <div class="pager"></div>
</div>

.pager {
    font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
    border:1px solid #dddddd;
    border-radius:3px;
    display:inline-block;
    clear:both;
}
.pager a,.pager span {
    font-size:14px;
    color:#428bca;
    border-right:1px solid #dddddd;
    padding:4px 9px;
    float:left;
    text-decoration:none;
}
.pager span {
    color:#fff;
    background:#428bca;
}
.pager a:hover {
    color:#2a6496;
    background:#f2f2f2;
}
.pager a.last {
    border-right:0;
}

//生成Pager，当前页码, 总页数, 回调function
$.fn.pager = function(page, total, callback) {
    var html = '';
    html += '<a class="first" href="javascript:;">首页</a>';
    html += '<a class="first" href="javascript:;">上一页</a>';
    var start = page - 5 < 0 ? 0 : page - 5;
    var end = page + 5 < total ? page + 5 : total;
    for (var i = start; i < end; i++) {
        html += i == page - 1 ? '<span>' + (i + 1) + '</span>' : '<a href="javascript:;">' + (i + 1) + '</a>';
    }
    html += '<a class="first" href="javascript:;">下一页</a>';
    html += '<a class="last" href="javascript:;">末页</a>';
    $(this).html(html).find('a').click(function() {
        var p = $(this).text();
        if (p == '上一页') p = page == 1 ? 1 : page - 1;
        if (p == '下一页') p = page == total ? total : page + 1;
        if (p == '首页') p = 1;
        if (p == '末页') p = total;

        if (p != page) callback(parseInt(p));
    });
}

onload = function() {
    //用用回调
    function go(p) {
        $('.pager').pager(p, 82, go);
    }

    $('.pager').pager(1, 82, go);
}