jQuery -分页代码整理

js代码部分:

 let pageSize = 12;
 let pageIndex = 0;
 //创建页码
 function builDatapage(list) {
 //获得总页数
        let total = Math.ceil(list.length / pageSize);
        console.log(total);
        for(let i =0 ; i< total; i++){
            let $pageItem = $('<li></li>');
            $pageItem.text(i+1);
            $pageItem.bind('click',function () {
                $tbody.html('');
                //切换样式
                let $active = $pageDiv.find('.cliced');
                $active.removeClass('cliced');
                console.log($(this));
                $(this).addClass('cliced');

                pageIndex = this.innerText - 1;
                fillSingers(list);
            });
            $pageItem.appendTo($pageDiv);
        }
        $pageDiv.find('li:first-child').addClass('cliced');
    }

生成数据页代码部分

    function fillSingers(singers) {
        let startIndex = pageIndex*pageSize;
        let endIndex = (pageIndex+1)*pageSize;
        let temp = singers.slice(startIndex , endIndex);
        for(let i = 0 ;i < temp.length; i++){
            let $tr = createSingers(i,temp[i]);
            $tr.appendTo($tbody);
        }
    }

猜你喜欢

转载自blog.csdn.net/zhuxufeifei/article/details/82586383