Question

这是我正在尝试做的事情：

$(document).ready(function(){
    $('ul li:eq(3n+1)').css({backgroundColor:'#f00'});
});

HTML

<ul>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
</ul>

http://jsfiddle.net/mD6Hf/2/

Answer 1

因为你似乎把jQuery的eq()选择器与CSS':nth-child()伪选择器搞混了。

为此使用CSS选择器（尽管在jQuery的上下文中）：

$(document).ready(function(){
    $('ul li:nth-child(3n+1)').css({backgroundColor:'#f00'});
});

JS Fiddle demo

使用filter()您可以使用：

$('li').filter(
    function(i){
        if (i%3 + 1 == 1){
            return $(this);
        }
}).css('background-color','#f00');

JS Fiddle demo

但我无法看到如何使用eq()，因为据我所知，这只是为了返回一个结果（尽管我没有详尽地阅读整个jQuery API）。 / p>

参考文献：

:nth-child selector()。
filter()。

Answer 2

或者如果你想使用：eq（）然后尝试这样：

$('ul li:eq(3)').css({backgroundColor:'#f00'});

：eq（）从0开始。意味着索引3是第四个元素。

Answer 3

这是一个使用更多jQuery来完成工作的解决方案：

$(document).ready(function(){
    $('ul li').each(function(i,el) {
        if (i%3==0)
        $(this).css({backgroundColor:'#f00'});
    })
});

http://jsfiddle.net/mD6Hf/6/

即使浏览器不支持CSS3，这也会有效。

Jquery：eq（）选择器不适合我

3 个答案: