使用jquery遍歷列表元素

Question

我正在構建一個微型網站，我有一個問題。我想通過點擊我的菜單滾動到不同的列表元素。這工作正常。但問題是，通過使用列表索引來遍歷主菜單的第二或第三個元素，它在第一個菜單中唯一的工作正常，因爲第二個菜單的索引是從3開始的，並添加到第一個菜單中。所以.mainmenu.children是錯誤的電話，但我不知道正確的。

所以問題是，我怎麼才能通過他的父菜單選擇一個列表索引？我不想使用三個不同的ID，因爲菜單應該是動態的。

希望有人能幫助我。

問候

H-man24

$('.mainmenu').children('li').click(function(){  
    var myIndex = $('.mainmenu li').index(this); 
    alert(myIndex + " " + myPosition); 
    var myPosition = $('#page > li').eq(myIndex).offset().top; 
    $('html, body').animate({scrollTop:myPosition, duration:500, easing:'easeInOutCirc'}); 
}); 

HTML：

<ul> 
<li> 
    <div> 
    <ul class="mainmenu"> 
    <li>Link to 1</li> (index 0) 
    <li>Link to 2</li> (index 1) 
    <li>Link to 3</li> (index 2) 
    </ul> 
    <div>Content 1></div> 
    </div> 
</li> 
<li> 
    <div> 
    <ul class="mainmenu"> 
    <li>Link to 1</li> (index 3, should be 0) 
    <li>Link to 2</li> (index 4, should be 1) 
    <li>Link to 3</li> .... 
    </ul> 
    <div>Content 2></div> 
    </div> 
</li> 
<li> 
    <div> 
    <ul class="mainmenu"> 
    <li>Link to 1</li> 
    <li>Link to 2</li> 
    <li>Link to 3</li> 
    </ul> 
    <div>Content 3></div> 
    </div> 
</li> 

Answer 1

如何：

$('.mainmenu li').click(function(){ 

    var myIndex = $(this).closest('.mainmenu').children('li').index(this); 
    alert(myIndex + " " + myPosition); 
    var myPosition = $('#page > li').eq(myIndex).offset().top; 
    $('html, body').animate({scrollTop:myPosition, duration:500, easing:'easeInOutCirc'});  
    });