Question

如果我有这样的结构：

<ul>
     <li>Foo</li>
     <li>Man</li>
     <li>Choo</li>
</ul>
<ul>
     <li>Tom</li>
     <li class="active">Dick</li>
     <li>Harry</li>
</ul>

我选择这样的选择：

jQuery('li.active').index();

结果将是1，当我想要的是5时（如果基于零的计数则为4）。

我该怎么做？我确信这非常简单，我只是画一个空白。

谢谢！

Answer 1

如果将此结构包装在容器div中：

<div id="list">
    <ul>
         <li>Foo</li>
         <li>Man</li>
         <li>Choo</li>
    </ul>
    <ul>
         <li>Tom</li>
         <li class="active">Dick</li>
         <li>Harry</li>
    </ul>
</div>

然后，你可以使用这个jQuery：

$("#list li").index($("#list li.active"));   // gives you 4

此处的演示演示：http://jsfiddle.net/jfriend00/KRqZp/。

这构建了所有li标签的jQuery对象。然后它在li.active的列表中找到索引，我认为这是你想要的。

使用.index()的方法有多种，具体取决于它的使用方式。此特定方法返回上一个选择器中的哪个项与您传递给.index()的参数匹配。

Answer 2

Index返回所选元素相对于其兄弟（see docs）的位置。

你需要尝试的是这样的事情：

var liIndex = -1;
$('li').each(function(i) {
    if ($(this).hasClass('active'))
        liIndex = i;
});

jQuery - 如何获取元素相对于其选择的索引（不是它的父级）

2 个答案: