jquery - 计算分组和分页的行数

Question

我有以下代码，我尝试在表行中翻页下一页和上一页

$( "a.paginate" ).click( function( e ) {
e.preventDefault();
if ( $( this ).attr( "id" ) == "next" ) {
//what to write here? 
// firstrecord should be between 0 and max rows
// somehow page size has to be added to the firstrecord
} else {
//what to write here?
// pagesize has to be subtracted, but unable to figure how to
}
paginate( firstRecord, pageSize );
});

http://jsfiddle.net/99xAU/1/

任何人都可以帮我整理如何使代码工作

Answer 1

您可以使用slice :

Description: Reduce the set of matched elements to a subset specified by a range of indices.

定义要在当前页面中显示的元素。

代码:

var firstRecord = 0;
var pageSize = 4;
var tableRows = $("#movie tbody tr");

$("a.paginate").click(function (e) {
    e.preventDefault();
    var tmpRec = firstRecord;
    if ($(this).attr("id") == "next") {
        tmpRec += pageSize;
    } else {
        tmpRec -= pageSize;
    }
    if (tmpRec < 0 || tmpRec > tableRows.length) return
    firstRecord = tmpRec;
    paginate(firstRecord, pageSize);
});

var paginate = function (start, size) {
    var end = start + size;
    tableRows.hide();
    tableRows.slice(start, end).show();
}


paginate(firstRecord, pageSize);

演示:http://jsfiddle.net/H9JBT/

更新

对于隐藏/显示下一个/上一个按钮，您可以使用 :visible 检查第一个/最后一个元素是否可见。和 is .

代码:

var paginate = function (start, size) {
    var end = start + size;
    tableRows.hide();
    tableRows.slice(start, end).show();
        $(".paginate").show();
    if (tableRows.eq(0).is(":visible")) $('#previous').hide();
        if (tableRows.eq(tableRows.length-1).is(":visible")) $('#next').hide();
}

演示:http://jsfiddle.net/IrvinDominin/LPwVB/