Question

我有一组span元素，如下所示

<div>
  <span class='foo'>foo0</span>
  <span class='foo'>foo1</span>  
  <span class='foo'>foo2</span>
  <span class='foo'>foo3</span>
  <span class='foo'>foo4</span>
</div>

我已将鼠标添加到鼠标中并将事件鼠标移出到每个span元素。现在，在事件中鼠标是否可以找到使用jQuery当前悬停的span元素是否是具有类foo的第一个span元素？

Answer 1

您可能需要查看.index()

$('.foo').bind('mouseover', function(){
    alert('I am ' + $(this).index());
});

如果您明确只需要检查first-child，请使用选择器:first-child。

$('.foo').bind('mouseover', function(){
    if($(this).is(':first-child'))
       alert('I am first');
});

在此处试试：http://www.jsfiddle.net/YjC6y/5/

参考：.index()，.is()，:first-child

Answer 2

像这样：

if($(this).is(':first-child'))

Answer 3

像这样：

if($(this).is(":first-child")){
}

Answer 4

此处提供的所有答案都是正确的。但是，对于更一般的规则，您可以使用:eq() selector：

$('.foo').bind('mouseover', function(){
    if($(this).is(':eq(0)')) {
       alert('I am first');
    }
});

（适应jAndy的回答）

这测试元素在其兄弟中的第0个索引（即，第一个 - eq使用从零开始的索引）。您可以使用

检查第三项

if ($(this).is(':eq(2)')) {

jQuery和第n个元素

4 个答案: