控制jQuery的index（）函数的范围

Question

我这样：http://jsfiddle.net/ZP76c/

我正在尝试控制jQuery根据索引（）选择元素的范围，可能吗？

<div class="holder">
    <div class="first">First</div>
    <div class="second">Second</div>
    <div class="first">First</div>
    <div class="second">Second</div>
</div>​

$('.holder div').click(function(){
     alert($(this).index());            
});

// desired behaviour: clicking the first 'first' div will alert: "0"
// clicking the second 'first' div, will alert: "1"
// so it takes the divs with a class of 'second' out of the index() calculation
// possible with jQuery .index()?
​

Answer 1

以下内容应符合您的需求：

$('.holder div.first').click(function() {
    alert($(this).index(".first"));            
});

或者更一般的解决方案（所以.second也这样做）：

$('.holder div').click(function() {
    alert($(this).index("." + $(this).prop("class")));            
});

这只适用，如果每个div只有一个类，并且该类是“first / second / third”等。

如果您的div有多个类，您可以添加一个数据属性，然后执行以下操作：

$('.holder div').click(function() {
    alert($(this).index("[data-category=" + $(this).attr("data-category") + "]"));            
});

和HTML：

<div class="holder">
    <div class="first" data-category="first">First</div>
    <div class="second class-does-not-matter" data-category="second">Second</div>
    <div class="first another-div-class" data-category="first">First</div>
    <div class="second div-class" data-category="second">Second</div>
</div>​​​​​​​​​​​​​​​​​​

data-category设置为其成员的任何类别。

Answer 2

您可以传递给要计算其索引的选择器.index()。例如：在您的情况下，alert($(this).index('div.first'));