jquery某类元素索引

Question

我在容器内有某个类的多个元素，我想获取该特定元素的索引。假设我有这个 HTML:

<div id="TheContainer">

  <div class="MyClass">My Class</div>
  <div class="SomeClass">Not My Class</div>
  <div class="SomeOtherClass">Not My Class</div>
  <div class="SomeClass">Not My Class</div>
  <div class="MyClass">My Class</div>
  <div class="SomeOtherClass">Not My Class</div>
  <div class="SomeClass">Not My Class</div>
  <div class="MyClass">My Class</div>

</div>

我想获取MyClass的索引。这是我尝试过的:

$('#TheContainer').on({
    click: function () { 

       console.log($(this).parent().children('.MyClass').index()); }

}, '.MyClass');

例如，如果用户单击第三个 MyClass 元素，它应该控制台 2。 jsFiddle 是 here .

谢谢。

Answer 1

请注意index()有一个可选的元素参数:

.index( element )

element

Type: Element or jQuery The DOM element or first element within the jQuery object to look for.

因此在这种情况下，您可以使用 this 作为参数:

$(this).parent().children('.MyClass').index(this);

JSFiddle here.