Question

假设我有以下HTML：

<div id="Container">
    <div class="TheClass"></div>
    <div class="TheOtherClass"></div>
    <div class="TheClass"></div>
    <div class="TheOtherClass"></div>
    <div class="TheClass"></div>
    <div class="TheOtherClass"></div>
</div>

如你所见，我有两个班级交替。我想根据它在容器中的出现来传递类TheClass的索引。

如果我写：

$('#Container').on({
   click: function () { SomeFunction($(this).index()); }
}, '.TheClass');

并单击最后一个元素TheClass，传递的参数将为5，但我希望收到3，因为最后一个TheClass元素是第三次出现。我怎么能这样做？

感谢。

Answer 1

尝试将选择器作为参数

的index()变体

$('#Container').on({
    click: function () {
        SomeFunction($(this).index('#Container .TheClass'));
    }
}, '.TheClass');

演示：Fiddle

Answer 2

只需根据您要引用的类来定义索引：

    $('#Container').on({
        click: function () { 
            SomeFunction($(this).index("." + $(this).attr('class')) + 1);
        }
    }, '.TheClass');

通过这种方式，您的代码更干净，更便携。

传递类的出现指数

2 个答案: