5
$j('.select-all-these:not(.except-these):nth-child(3n)');

特定のクラスを持たないアイテムを3つおきに選択しようとしています。これは私のjQueryセレクターですが、機能しません-:nth-​​childセレクターは:notセレクターを無視しているようです。私はそれを間違っていますか?

例として、これはそれがどのように機能するべきかです:

.select-all-these.except-these
.select-all-these.except-these
.select-all-these.except-these
.select-all-these
.select-all-these.except-these
.select-all-these
.select-all-these <-- THIS ONE IS SELECTED
.select-all-these.except-these

ありがとう!:)

4

5 に答える 5

6

代わりに、このメソッドを使用して結果をフィルタリングするのはどうですか?

$('.select-all-these:nth-child(3n)').not('.except-these');

これがデモンストレーションするフィドルです:http://jsfiddle.net/ntNgC/

于 2012-05-09T05:18:00.650 に答える
6

この作業を行うために私が見ることができる唯一の方法は、2つのfilter()呼び出しを使用することでした。

$('.select').filter(
    function(){
        return !$(this).hasClass('dontselect');
    }).filter(
        function(i){
            return (i+1)%3 == 0; // unless you want a zero-based count, regular CSS is one-based
        }).css('color','red');

JSフィドルデモ

filter()ただし、外部変数を使用して単一の呼び出しを使用することはできます。

var count = 0;
$('.select').filter(
    function(){
        console.log(!$(this).hasClass('dontselect'));
        if (!$(this).hasClass('dontselect')){
            count++;
            return count%3 == 0;
        }
    }).css('color','red');

JSフィドルデモ

JS Perfの報告によると、単一のフィルターは、当然のことながら、少し高速ですが、非常に、非常にごくわずかです。

参照:

于 2012-05-09T06:31:10.277 に答える
3

更新:これは、n番目の子またはjQueryの別のセレクターでは不可能だと思います。したがって、より詳細なソリューションの使用を検討してください。

var count = 0;
$('.select-all-these').each(function() {
    if(!$(this).hasClass('except-these')) {
        count++;
    }
    if(count === 3) {
        $(this).text('every 3rd element');
        count = 0
    }
});​

http://jsfiddle.net/TJdFS/2/(代替バージョン: http: //jsfiddle.net/TJdFS/

:nth-​​childは、:notなどの追加のフィルターを無視して、一致するすべての要素をカウントします。

jquerydocを参照してください。

:nth-​​child(n)疑似クラスは:eq(n)と簡単に混同されますが、2つは劇的に異なる一致要素をもたらす可能性があります。:nth-​​child(n)を使用すると、子が何であるかに関係なく、すべての子がカウントされ、指定された要素は、疑似クラスにアタッチされたセレクターと一致する場合にのみ選択されます。:eq(n)を使用すると、疑似クラスにアタッチされたセレクターのみがカウントされ、他の要素の子に限定されず、(n + 1)番目のセレクター(nは0ベース)が選択されます。

例:

<div class="select-all-these">1</div>
<div class="select-all-these except-these">2</div>
<div class="select-all-these except-these">3</div>
<div class="select-all-these">4</div>
<div class="select-all-these except-these">5</div>
<div class="select-all-these">6</div>

JS:

$('.select-all-these:not(.except-these):nth-child(6)').text('nth-child counts all elements (1 based!)');
$('.select-all-these:not(.except-these):eq(1)').text('eq counts only matching elements (0 based!)');

結果:

1
2
3
eq counts only matching elements. (0 based!)
5
nth-child counts all elements (1 based!)

http://jsfiddle.net/nFtkE/2/ </ p>

于 2012-05-09T05:22:24.820 に答える
3

最も簡単な方法=)

$('table tr:not(.class)').eq(1);

頑張って=)

于 2014-01-13T18:29:42.493 に答える
1

N番目の子は、フィルタリングされたグループの選択を操作するときに直感に反する可能性があります。

.each()を使用して、その制限を回避します。

var count = 0;
$('.select-all-these:not(.except-these)').each(function(){
    if ( count++ % 2 == 0 ) $(this).css('color','red')
})
于 2012-10-26T04:52:49.290 に答える