jquery - eq() 选择每 4 个类别

Question

我想使用 eq() 选择每第四个项目来添加一个类以将右边距归零。我得到了一组混合产品，其中有一个可以打开和关闭产品的子导航。

nth() 不起作用，因为即使选择了 display:none 且选择了特定类别，它也会对所有产品进行计数。

Jquery


$('li.prod').toggle(true);



<p>$('li.prod:visible:nth-child(4n)').addClass('prod-end');</p>

<p>$('li.button').click(function () {</p>

<pre><code>$('li.button').removeClass('active');
$(this).addClass('active');

$('li.prod').removeClass('prod-end');

if ( $('li#all').hasClass('active')) {

$('li.prod').toggle(true);

$('li.prod:visible:nth-child(4n)').addClass('prod-end');

} else {

$('li.prod').toggle(false);

$('li.' + $(this).text()).toggle(true);

$('li.' + $(this).text() + ':visible:nth-child(4n)').addClass('prod-end');

}
</code></pre>

<p>});</p>



HTML



<pre><code> <div class="subNav">
<ul>
<li class="button active" id="all">all</li>
<li class="button" id="men_apparel">men</li>
<li class="button" id="women_apparel">women</li>
<li class="button" id="kids">kids</li>
</ul>
</div>

<div class="products">
<ul class="products_wrapper">

<li class="prod women">
</li>
<li class="prod women">
</li>
<li class="prod women">
</li>
<li class="prod women">
</li>
<li class="prod men">
</li>
<li class="prod men">
</li>
<li class="prod men">
</li>
<li class="prod kids">
</li>
<li class="prod kids">
</li>
<li class="prod kids">
</li>
<li class="prod kids">
</li>
</ul>
</div>
</code></pre>



提前致谢!

Answer 1

    $('.products_wrapper li').each(function(){
        var i = $(this).index()+1;
        if (i%4==0) {
            $(this).addClass('prod-end');
        };
    });