获取不同容器中相同元素类的jquery索引

时间:2012-06-03 18:49:35

标签: jquery indexing

在事件“click”上,我想得到一个可以在多个容器中的元素的索引。返回的索引位置应相对于其容器而不是body标签计算。

我在这里写了一个例子:http://jsfiddle.net/zUGcK/

我的问题是,当我点击第二个块容器中的行时,返回的行索引是:3,4,5,而我希望返回0,1,2。

我应该在jquery index()参数中更改为两个容器中的每一行返回0,1,2?

由于

http://jsfiddle.net/zUGcK/

$('.line').click(function()
{
    alert('index: '+$(this).index('.container .line'));
});

<div class="container">
<div class="header">block #1</div>
<div class="line">line #0</div>
<div class="line">line #1</div>
<div class="line">line #2</div>
</div>

<div class="container">
<div class="header">block #2</div>
<div class="line">line #0 (index 3 returned instead of 0)</div>
<div class="line">line #1 (index 4 returned instead of 1)</div>
<div class="line">line #2 (index 5 returned instead of 2)</div>
</div>

2 个答案:

答案 0 :(得分:18)

您可以使用它来获取容器

中元素的索引值
$(function()
{
    $('.line').click(function()
    {
        //alert('index: '+$(this).index('.container .line'));

        alert($(this).closest('.container').find('.line').index(this));
    });
});

您必须使用$.index

的这种语法
.index( element )
element The DOM element or first element within the jQuery object to look for.
​

Working Fiddle

答案 1 :(得分:0)

使用$ this更新了索引。

 $('.line').click(function()
{
    var $this=$(this);
   var indx= $this.parent('.container').find('.line').index($this);

    alert('index: '+indx);
});