jQuery的嵌套UL下拉菜單

我想要的鏈接被點擊並在第二次點擊再向上滑動時，嵌套的菜單滑下。這是行得通的。

我還需要任何其他打開的嵌套菜單關閉，當另一個鏈接被點擊。這不起作用。

我試圖在打開嵌套菜單之前關閉任何打開的嵌套菜單我想要但是當嵌套菜單中的鏈接被點擊時，這也會關閉嵌套菜單。

$(document).ready(function() { 
    $('#nav ul.children').slideUp(); 
    $('#nav li').click(function (e) { 
     $('ul.children').slideUp(); 
     $('ul', this).slideToggle(); 
     e.stopPropagation(); 
    }); 
});

http://www.ttmt.org.uk/forum/nav/index2.html

我怎樣才能的slideToggle嵌套菜單時，它的父被點擊並關閉所有打開嵌套的菜單中點擊另一個鏈接時。

<ul id="nav"> 
    <li><a href="#">One</a> 
    <ul class="children"> 
     <li><a href="http://www.google.com">One/One</a></li> 
     <li><a href="http://www.bbc.com">One/Two</a></li> 
     <li><a href="#">One/Three</a></li> 
    </ul> 
    </li> 
    <li><a href="#">Two</a></li> 
    <li><a href="#">Three</a> 
    <ul class="children"> 
     <li><a href="#">Three/One</a></li> 
     <li><a href="#">Three/Two</a></li> 
    </ul> 
    </li> 
</ul>

$(document).ready(function(){ 
    $('#nav ul.children').slideUp(); 
    $('#nav li').click(function(e){ 
    //$('ul.children').slideUp(); 
    $('ul', this).slideToggle(); 
    e.stopPropagation(); 
    }); 
});

編輯

我有我的代碼中的另一個主要問題，因爲我關閉嵌套UL在開始與

$('#nav ul.children').slideUp();

單擊鏈接並重新加載頁面時，所有菜單都關閉。如何在頁面重新加載時保持嵌套菜單打開。

來源

2012-04-25 ttmt

您的鏈接都死了，這不是很有用。 – Johannes 2013-09-23 15:08:46

爲了防止子項被點擊時的動作，使用此：

$('#nav > li').click(function(e){ ...

的「>」字符選擇的李是一個孩子相反，任何後代

...所以當點擊次級鏈接中的鏈接時不會發生$('ul.children').slideUp();。

來源

2012-04-25 09:33:01 Faust

首先是隱藏使用在頁面加載CSS樣式隱藏所有嵌套UL標籤來解決你的第二個問題（頁面加載）

li ul 
{ 
    display:none; 
}

把這個腳本

$("#nav li").click(function(){ 
    $(this).parent().find("li ul:visible").slideUp(); //this helps to slideUp visible uls 
    //then your code 
});

來源

2012-04-25 10:12:54 Dharmesh

jQuery的嵌套UL下拉菜單

回答

相關問題