Ограничить: результаты nth-child для видимых элементов - PullRequest
Новая
       32

Ограничить: результаты nth-child для видимых элементов

4 голосов
/ 24 марта 2011

В jQuery я хочу добавить класс для всех видимых элементов, которые являются 5-м дочерним или более поздним, и другой класс для каждого элемента, который не является 4-м дочернимРаньше я делал это: 

$overlay.find('> .container .content .selector').not(':nth-child(4n)').addClass('hasRightMargin');
$overlay.find('> .container .content .selector:nth-child(n+5)').addClass('hasTopMargin');

Однако теперь я переключаю видимость первого .selector, а :nth-child не учитывает видимость, поэтому это не работает, так как яхочу, потому что он все еще считает невидимый элемент: 

$overlay.find('> .container .content .selector:visible').not(':nth-child(4n)').addClass('hasRightMargin');
$overlay.find('> .container .content .selector:visible:nth-child(n+5)').addClass('hasTopMargin');

Есть ли способ сделать то, что я хочу, в одном селекторе?Или мне придется пройти через все элементы .selector, используя each, и отфильтровать их там вручную?

Ответы [ 2 ]

1 голос
/ 24 марта 2011

Я думаю, что это должно сработать. 

$overlay.find('> .container .content .selector:visible:not(:odd:odd)').addClass('hasRightMargin');
$overlay.find('> .container .content .selector:visible:gt(3)').addClass('hasTopMargin');

Ваша основная проблема заключается в том, что n-й дочерний элемент выбирает все элементы, являющиеся n-ным дочерним элементом их родительского элемента, , а не n-ых элементов в наборе. Также имейте в виду, что селекторы, такие как: odd,: even,: gt,: lt, имеют индекс 0. Итак: нечетно выделяются элементы 1,3,5 и т. Д. 2-й, 4-й, 6-й элементы на странице. И: odd: odd выбирает каждый 4-й элемент на странице. Аналогично,: gt (3) выбирает все элементы с индексом 4 или более, который является 5-м элементом и более.

Смотрите здесь для jsfiddle, который, я думаю, демонстрирует то, что вы искали. Обратите внимание на скрытые элементы div, которые были переданы.

0 голосов
/ 24 марта 2011

Можете ли вы .find () использовать видимые элементы перед применением селектора: nth-child?Может быть, что-то вроде 

$overlay.find("> :visible").find('.container .content .selector').not(':nth-child(4n)')...
...