javascript - jQuery - check if selected row is last visible row in table - Stack Overflow

admin管理员组

文章数量:1318579

previously i checked whether a row is last row in a table like this in a condition:

$row.is(':last-child')

which works fine.

Now, i have a requirement where some of the rows in the table are hidden - now i have to check whether a specific row is the last visible row in the table.

I tried with this:

$row.is(':visible:last-child')

but not that successfull. Does someone have a clue?

previously i checked whether a row is last row in a table like this in a condition:

$row.is(':last-child')

which works fine.

Now, i have a requirement where some of the rows in the table are hidden - now i have to check whether a specific row is the last visible row in the table.

I tried with this:

$row.is(':visible:last-child')

but not that successfull. Does someone have a clue?

• javascript
• jquery
• css
• jquery-selectors
• jquery-traversing

Share Improve this question Follow edited Aug 19, 2014 at 0:08 falsarella 12.4k1010 gold badges7474 silver badges118118 bronze badges asked Nov 5, 2012 at 15:15 owsataowsata 1,22511 gold badge1212 silver badges2525 bronze badges 2

• 1 should work, just like $("#question").is(':visible:last-child') on this page returns false but $("#question").is(':visible:first-child') returns true. How doesn't it work? – st3inn Commented Nov 5, 2012 at 15:27
• I have a strange feeling, but I think he may misunderstand what the :visible selector does. It doesn't check if something is off the page (ie. scrolling). It just sees if something is not hidden on the page. A pure shot in the dark but hey, it might be helpful. – psx Commented Nov 5, 2012 at 16:14

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

This doesn't work because the last-child is display: none;.

One approach is to iterate the childs to find the index of the last visible child (see fiddle) :

var $rows = $('td');
var $rowsReverse = $($rows.get().reverse());

var $lastVisibleIndex = -1;
$rowsReverse.each(function(index) {
    if ($lastVisibleIndex == -1 && $(this).is(':visible')) {
        $lastVisibleIndex = $rowsReverse.length - index - 1;
    }
});

$rows.each(function(index) {
    var $row = $(this);
    if (index == $lastVisibleIndex) {            
        $row.addClass('red');
    }
});​

Thanx everybody for the quick feedback. I could solve it with the following:

$row.parent().find('tr:visible').last().attr('data-id') is $row.attr('data-id')

(it's in a loop)

@falsarella your answer i guess works fine - is a bit plicated, but it works apparently.

You could try

$(element).is(":visible").last();

or

$(element:visible).last();

If that doesn't work, let me know.

本文标签： javascriptjQuerycheck if selected row is last visible row in tableStack Overflow