bootstrap-table刷新页面回到首页

新手在做前端的时候，需要分页。使用了bootstrap-table插件。第一次用，遇到了很多

坑。

其中，rows和total两个参数(含义请百度)，是必须有的，大家一定要注意，在看别人的博客的时候，很难这么注意细节。所以走了一定的弯路。在把分页做出来之后，又遇到了刷新页面，也就是按F5那种，刷新整个页面，会回到第一页的问题。

在网上找了很多的资料，得到的都是在按刷新按钮，或者是通过一个事件进行刷新的方案。或者是有些人根本没遇到这种问题。我也不知道为什么。总是能够找到的帮助，都是没有用的。

最后研究官方文档，pageNumber这个参数，是用来确定选定的页面的。因此通过这个入口，来解决问题。经过仔细查文档，发现onPageChange方法，是在发生页面变化时，也就是翻页时候，可以触发的事件。因此，综合这两点，在页面载入时候，pageNumber是已知的。在翻页时候，存下当前的分页页码。

那么就用cookie。在页面载入时候，读取cookie。

<script>
if($.cookie('c_pn')==null)
{
    pn=//pn就是pagenumber.如果cookie里面没有，就让pagenumber=1；那么就会从第一页开始了 。
}

            pn =parseInt($.cookie("c_pn"))//存在cookie里面的，都是字符串，转为int



            $("#tb1").bootstrapTable({
                url: "{:url('admin/test/getpage')}", // 获取表格数据的url
                cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
                paginationloop: false,
                showFullsrceen: true,
                paginationPreText: "上一页",
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                striped: true, //表格显示条纹，默认为false
                pagination: true, // 在表格底部显示分页组件，默认false
                pageList: [, ], // 设置页面可以显示的数据条数
                pageSize: , // 页面数据条数
                pageNumber:pn, // **首页页码**这里使用了定义的，也就是从cookie里面拿出来的值
                silent: true,
                showRefresh: true,

                sidePagination: 'server', // 设置为服务器端分页
                responseHandler: responseHandler,

                queryParams: function (params) {
                    // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
                    var temp = {
                        pageSize: params.limit, // 每页要显示的数据条数
                        offset: params.offset,
                        pageNumber: params.pageNumber
                    }
                    return  temp;
                },

                columns: [
                    {
                        field: 'id', // 返回json数据中的name
                        title: '编号', // 表格表头显示文字
                        width: 
                    },
                    {
                        field: 'craftType', // 返回json数据中的name
                        title: '机型', // 表格表头显示文字
                        width: ,

                    },
                    {
                        field: 'time', // 返回json数据中的name
                        title: '时间', // 表格表头显示文字
                        width: 
                    },
                    {
                        field: 'craftNum', // 返回json数据中的name
                        title: '机号', // 表格表头显示文字
                        width: 
                    },
                    {
                        field: 'description', // 返回json数据中的name
                        title: '描述', // 表格表头显示文字

                    },
                    {
                        field: 'condition', // 返回json数据中的name
                        title: 'fa', // 表格表头显示文字

                    },
                    {
                        field: 'person', // 返回json数据中的name
                        title: '描述', // 表格表头显示文字

                    },
                    {
                        field: 'ata', // 返回json数据中的name
                        title: '描述', // 表格表头显示文字

                    },
                    {
                        field: 'img1', // 返回json数据中的name
                        title: '图片1', // 表格表头显示文字
                        formatter: function (value, row, index) {
                            var s;
                            if (row.img1 != null)
                            {
                                var url = row.img1;


                                s = '<a class = "view"  href="' + '__IMG__' + strReplace(url) + '" > <img id="img1" style="width:40;height:40px;"  src="' + '__IMG__' + strReplace(url) + '" /></a>'
                            }
                            return s;
                        },
                        events: 'operateEvents'
                    },
                    {
                        field: 'img2', // 返回json数据中的name
                        title: '图片2', // 表格表头显示文字

                    },
                    {
                        field: 'img3', // 返回json数据中的name
                        title: '图片3', // 表格表头显示文字
                    },
                ],
                onPageChange:function(number,size){$.cookie("c_pn",number);},
setcookie:function(){ $.cookie("c_pn", pageNumber);},
            }
            )

//       }

            function strReplace(str)
            {
                str = str.replace(/\\/g, "/");
                return str;
            }
//            onload="refresh";
            function responseHandler(res) {
                return{
                    rows: res.data.rows,
                    total: res.data.total,
                    pageNumber: res.data.pageNumber
                };
            }
            ;
            `