JQuery получить элементы без отображения = "нет" - PullRequest
Новая
       15

JQuery получить элементы без отображения = "нет"

14 голосов
/ 24 апреля 2011

Как я могу получить все tbody > tr, которые не имеют этого атрибута стиля: display: none?

Ответы [ 2 ]

19 голосов
/ 24 апреля 2011 
$("tbody > tr:visible")

Следует сделать это с помощью селектора :visible.

18 голосов
/ 23 августа 2017

Принятый ответ работает и очень полезен, но не технически, о чем прямо спросил ОП.

Я, правда, расщепляю волосы, но мне нужно было найти только элементы tr, которые буквально не содержали display: none в их атрибуте style, потому что родительский элемент мог бы быть скрытым, таким образом, не возвращая никаких элементов.

Итак, я написал следующее: 

var $trWithoutDisplayNone = $('tbody > tr:not([style*="display: none"])');

Обновление:

Исходный код выберет массив всех tr с на странице без атрибута стиля, содержащий "display: none".

Более эффективным и конкретным способом было бы нацеливание на сам стол.

HTML: 

<table id="tableID">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr style="background: grey; display: none;">
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
    </tr>
    <tr>
        <td>9</td>
        <td>10</td>
        <td>11</td>
        <td>12</td>
    </tr>
</table>

JavaScript / JQuery: 

<script>
    function getDisplayedRows($targetTable) {
        return $targetTable.find('tr:not([style*="display: none"])');
    }

    var $table = $("#tableID"),
        $visibleRows = getDisplayedRows($table);
</script>
...