Lấy chỉ số jquery của cùng một lớp phần tử trong các vùng chứa khác nhau

Question

Khi sự kiện "bấm", tôi muốn lấy chỉ mục của một phần tử có thể nằm trong nhiều vùng chứa. Vị trí chỉ mục được trả về phải được tính tương đối với vùng chứa của nó và không được tính vào thẻ body.

tôi đã viết một ví dụ ở đây: http://jsfiddle.net/zUGcK/

Vấn đề của tôi là khi tôi bấm vào các dòng trong container khối thứ hai, chỉ số dòng trở lại là: 3, 4, 5 trong khi tôi muốn 0, 1, 2 được trả lại.

Tôi nên thay đổi điều gì trong các đối số jquery index() để nhận 0, 1, 2 được trả lại cho mỗi dòng trong cả hai vùng chứa?

Cảm ơn

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> 

Answer 1

Bạn có thể sử dụng điều này để có được những giá trị chỉ số cho các yếu tố bên trong nó là chứa

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

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

Bạn phải sử dụng cú pháp này $.index

.index(element) 
element The DOM element or first element within the jQuery object to look for. 
​ 

Working Fiddle

Answer 2

Chỉ mục được cập nhật với $ this.

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

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