Bootstrap paginator分页控件实例

    <!--分页插件，需额外引用jquery-->
    <script src="/Scripts/bootstrap/js/bootstrap-paginator.min.js"></script>

<script type="text/javascript">


        $(function () {
            getDataList(1);
        });


        /**
         *
         * @param pageCurrent 当前所在页
         * @param pageSum 总页数
         * @param callback 调用ajax
         */
        function setPage(pageCurrent, pageSum, callback) {

            $(".pagination").bootstrapPaginator({
                //设置版本号
                bootstrapMajorVersion: 3,
                // 显示第几页
                currentPage: pageCurrent,
                // 总页数
                totalPages: pageSum,
                //当单击操作按钮的时候, 执行该函数, 调用ajax渲染页面
                onPageClicked: function (event, originalEvent, type, page) {
                    // 把当前点击的页码赋值给currentPage, 调用ajax,渲染页面
                    currentPage = page;

                    getDataList(page);

                    callback && callback();
                }
            })
        }

function getDataList(page){

            $.ajax({
                type: "post",
                url: "test.ashx",
                dataType: "json",
                //async:true,
                data: {
                    pageIndex: page,//页数
                    pageCount: 10,//每页显示的数量
                },
                success: function (data) {
                    if (data.IsSucess) {
                        //toTR自己写的方法用于将数据列表转为tr列表、
                        $("#tbRemind").html(toTR(data.Datas));

                        setPage(data.Remark.Page, data.Remark.Sum / (data.Remark.Page * 10));
                    }
                    else {
                        alert(data.Message);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    //alert(XMLHttpRequest.status);
                    //alert(XMLHttpRequest.readyState);
                    //alert(textStatus);
                },
            });
}
    </script>