jQuery - 查找相对于其容器的元素索引

Question

这是我的 HTMl 结构:

<div id="main">
   <div id="inner-1">
      <img />
      <img />
      <img />
   </div>

   <div id="inner-2">
      <img />
      <img class="selected" />
      <img />
   </div>

   <div id="inner-3">
      <img />
      <img />
      <img />
   </div>
</div>

我想做的是获取 img.selected 元素相对于 #main div 的索引。因此，在此示例中，索引应为 4(假设基于 0 的索引)而不是 1。

我获取索引的常用方法是使用 $element.prevAll().length 但显然，这将返回相对于 #inner-2 div 的索引。

我尝试使用 $('img.selected').prevAll('#main').length 但返回 0 :/

Answer 1

这会起作用；它在 #main 内的所有 img 标记集中查找所选图像的索引。

$('#main img').index('img.selected');