与下一个和上一个分页

时间:2019-04-30 21:37:06

标签: jquery

我有一段代码可以创建分页。但是,不显示页码...我想修改此代码以显示“下一个”和“上一个”。关于如何执行此操作的任何想法?

[#lessons-table]是HTML表的ID,该表的表行列表显示在创建分页的函数上方。该表有100多行。到目前为止,该函数一次成功显示10行...在表下方显示页码。我希望删除页码并显示PREVIOUS和NEXT来翻页。

function create_pagination(){
    $('#lessons-table').after('<div id="nav"></div>');
    var rowsShown = 10;
    var rowsTotal = $('#lessons-table tbody tr').length;

    var numPages = rowsTotal/rowsShown;
    for(i = 0; i < numPages; i++) {
        var pageNum = i + 1;
        $('#nav').append('<a href="#" rel="'+i+'">'+pageNum+'</a> ');
    }
    $('#lessons-table tbody tr').hide();
    $('#lessons-table tbody tr').slice(0, rowsShown).show();
    $('#nav a:first').addClass('active');
    $('#nav a').bind('click', function(e){
        e.preventDefault();
        $('#nav a').removeClass('active');
        $(this).addClass('active');
        var currPage = $(this).attr('rel');
        var startItem = currPage * rowsShown;
        var endItem = startItem + rowsShown;
        $('#lessons-table tbody tr').css('opacity','0.0').hide().slice(startItem, endItem).
        css('display','block').animate({opacity:1}, 800);
    });    
}    

0 个答案:

没有答案