Question

<div id="container">
  <div class="aa"></div>
  <div class="bb"></div>
  <div class="aa"></div>
  <div class="bb"></div>
  <div class="bb"></div>
  <div class="bb"></div>
  <div class="bb"></div>
</div>

我只需要在循环时找到基于特定类的元素索引。

正常索引将在兄弟姐妹中给出元素索引号：我想只考虑同一个类的兄弟姐妹，并根据排序的兄弟姐妹给出索引。

$("#container div").each(function(){

    if($(this).hasClass('bb')){
        var index = $(this).index();
            //will give me 1,3,4,5 etc

        //I want 0,1,2 etc ie: list the index based on class 

      }
    if($(this).hasClass('aa')){
           var index = $(this).index();

            //will give me 0 , 2
      //I want 0,1 etc ie: list the index based on class 
      }

})

Answer 1

对于.index()，您可以将选择器作为参数传递（例如'.bb'）。

正如您在online documentation中找到的那样。

如果选择器字符串作为参数传递，则.index（）返回一个整数，表示原始元素相对于的位置选择器匹配的元素。如果找不到该元素， .index（）将返回-1。

所以你可以这样做：

$("#container div").each(function(i){

    if($(this).hasClass('bb')){
        var index = $(this).index('.bb');
    }
    else if($(this).hasClass('aa')){
        var index = $(this).index('.aa');
    }

});

jsFiddle Demo

Answer 2

如果将元素传递给index()方法，它将在匹配的元素中返回该元素的索引，而不是其兄弟元素。

因此，您可以将所有元素与当前类相同的类匹配，并在生成的jQuery对象上调用index()，并将当前元素作为参数传递：

$("#container div").each(function() {
    var index = $("#container div." + $(this).attr("class")).index(this);
    // ...
}

Answer 3

分拆他们：

var $as = $('container > .aa'),
    $bs = $('container > .bb');

for (...) {
    if ($this.hasClass('aa')) console.log($as.index($this));
    if ($this.hasClass('bb')) console.log($bs.index($this));
}

如何根据兄弟姐妹中的排序元素找到索引。

3 个答案: