jQuery - 如何获取元素相对于其选择的索引(而不是其父元素)

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() 的参数相匹配的项目。