鍍金池/ 問答/HTML/ laypage點(diǎn)擊頁碼無法跳頁?

laypage點(diǎn)擊頁碼無法跳頁?

laypage點(diǎn)擊頁碼的時(shí)候,從后端返回的第二頁數(shù)據(jù)會累加在第一頁的后面,無法跳轉(zhuǎn)到第二頁,是什么原因?


// //查詢?nèi)啃畔?function getInfo(page) {


    $.ajax({
        type: 'post',
        url: '/web/illegalMessages',
        data: {
            'page': page
        },
        async: false,
        success: function(data) {
            var list = data.data;
            totalRow = data.totalRow;

            if (data.flag == 'success') {
                for (var i = 0; i < list.length; i++) {
                    $('tbody').append(

                        '<tr id="' + list[i].illegalmessageid + '">' +
                        '<td>' + list[i].deal + '</td>' +
                        '<td>' + list[i].occurarea + '</td>' +
                        '<td>' + list[i].platenumber + '</td>' +
                        '<td>' + list[i].occurtime + '</td>' +
                        '<td>' + list[i].markImgPath + '</td>' +
                        '<td>' + list[i].detailImgPath + '</td>' +
                        '<td>' + list[i].voicePath + list[i].videoPath + '</td>' +
                        '<td>' + list[i].deal + '</td>' +
                        '</tr>'
                    )
                }
            }




            layui.config({
                base: 'base/lay/modules/'
            }).use(['element', 'form', 'layer', 'laypage', 'table'], function() {
                var element = layui.element;
                var layer = layui.layer;
                var laypage = layui.laypage;
                var table = layui.table;

                //分頁
                laypage.render({
                    elem: 'layPage' //分頁容器的id
                        ,
                    layout: ['prev', 'page', 'next', 'limits', 'count'] //排版
                        ,
                    limit: 10 //每頁顯示數(shù)
                        ,
                    count: totalRow //總條數(shù)
                        ,
                    groups: 3 //連續(xù)出現(xiàn)的頁數(shù)
                        ,
                    theme: '#1E9FFF' //自定義選中色值
                        ,
                    skip: true //開啟跳頁

                });

                function onclick() {
                    $('#layPage a').on('click', function() {//點(diǎn)擊頁碼
                        var page = $(this).attr("data-page");//獲取當(dāng)前的頁數(shù)
                        getInfo(page);//查詢當(dāng)頁數(shù)據(jù)
                    })
                }

                onclick()
            });

        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            console.log(XMLHttpRequest.status);
            console.log(XMLHttpRequest.readyState);
            console.log(textStatus);
        },
    })
}


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

回答
編輯回答
純妹

修改如下:
1.丟了curr參數(shù)。
2.跳頁laypage自帶參數(shù)jump
3.數(shù)據(jù)會累加是因?yàn)橹匦虏樵冎皼]有清空數(shù)據(jù)。

//查詢?nèi)啃畔?function getInfo(page) {

    $.ajax({
        type: 'post',
        url: '/web/illegalMessages',
        //dataType:'json',
        data: {
            'page': page
        },
        async: false,
        success: function(data) {

            //var data = JSON.parse(data);
            var list = data.data;
            totalRow = data.totalRow; //獲取總條數(shù)

            if (data.flag == 'success') {

                $('tbody').html(''); //先清空,否則再次查詢會在本頁累加數(shù)據(jù)

                for (var i = 0; i < list.length; i++) {
                    $('tbody').append(
                        '<tr id="' + list[i].illegalmessageid + '">' +
                        '<td>' + list[i].deal + '</td>' +
                        '<td>' + list[i].occurarea + '</td>' +
                        '<td>' + list[i].platenumber + '</td>' +
                        '<td>' + list[i].occurtime + '</td>' +
                        '<td>' + list[i].markImgPath + '</td>' +
                        '<td>' + list[i].detailImgPath + '</td>' +
                        '<td>' + list[i].voicePath + list[i].videoPath + '</td>' +
                        '<td>' + list[i].deal + '</td>' +
                        '</tr>'
                    )
                }
            }


            //配置并加載所需模塊
            layui.config({
                base: 'base/lay/modules/'
            }).use(['laypage', 'table'], function() {
                var laypage = layui.laypage;
                var table = layui.table;

                //實(shí)例化分頁
                laypage.render({
                    elem: 'layPage' //分頁容器的id
                        ,
                    layout: ['prev', 'page', 'next', 'limits', 'count'] //排版
                        ,
                    limit: 10 //每頁顯示數(shù)
                        ,
                    count: totalRow //總條數(shù)
                        ,
                    curr: page
                        ,
                    groups: 3 //連續(xù)出現(xiàn)的頁數(shù)
                        ,
                    theme: '#1E9FFF' //自定義選中色值
                        ,
                    skip: true //開啟跳頁
                        ,
                    jump: function(obj, first) { //點(diǎn)擊頁碼跳頁
                        if (!first) {
                            $('tbody').html('');
                            getInfo(obj.curr); //查詢,傳參:當(dāng)前頁
                        }
                    }

                });
            });

        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            console.log(XMLHttpRequest.status);
            console.log(XMLHttpRequest.readyState);
            console.log(textStatus);
        },
    })
}


$(function() {

    //初始化加載所有信息
    getInfo(1);


})
2017年4月12日 15:23