jQuery獲取某些子元素的索引並忽略其他人

Question

我試圖獲得子元素的索引ol，但也有一些h2在那裏，我不需要，因此污染我的結果時使用jQuery index()函數。

所以我需要ol的索引，就好像根本沒有任何h2一樣。因此，如果您點擊第三個ol，索引將是2而不是4。

的HTML看起來像這樣：

<div> 
    <h2>Title</h2> 
    <ol><li>Item</li><li>Item</li><li>Item</li></ol> 
    <h2>Title</h2> 
    <ol><li>Item</li><li>Item</li><li>Item</li></ol> 
    <h2>Title</h2> 
    <ol><li>Item</li><li>Item</li><li>Item</li></ol> 
    <h2>Title</h2> 
    <ol><li>Item</li><li>Item</li><li>Item</li></ol> 
</div> 

而jQuery的：

$('ol li').click(function() { 
    // get current index position of the ol 
    var itemIndex = $(this).parent('ol').index(); 

    alert(itemIndex); 
}); 

Answer 1

如果我很好理解，試試這個代碼

var ol = $('ol'); 
ol.find('li').click(function() { 
    var parentOl = $(this).parent('ol'); 
    // get current index position of the ol 
    var itemIndex = ol.index(parentOl); 
    alert(itemIndex); 
}); 

例如jsbin：http://jsbin.com/enugex/1/edit

Answer 2

試試這個

$(this).parent('ol').parent().children('ol').indexOf($(this).parent('ol')); 

Answer 3

修改您的jsfiddle

$('ol li').click(function (item,index) { 
    // get current index position of the ol 
     var itemIndex = $(this).parents('div').children('ol').index($(this).parent('ol')); 

    alert(itemIndex); 
});