始終顯示自舉下拉列表中的項目，該項目被點擊或導航時

類似：How to Display Selected Item in Bootstrap Button Dropdown Title 始終顯示自舉下拉列表中的項目，該項目被點擊或導航時

我有兩級菜單引導。我希望當一個項目被選中並且導航到該項目所在的下拉列表時，總是被顯示出來。下面是代碼的我砍下版本：

<ul class="menu-system"> 
<li class="active"> 
<a href="#">Location</a> 
</li> 
<li class="dropdown"> 
    <a href="#" class="dropdown-toggle menu-item" data-toggle="dropdown"> Top level Option 1</a> 
    <ul class="dropdown-menu"> 
     <li><a href="#"> Option 1</a></li> 
     <li><a href="#"> Option 2</a></li> 
     <li><a href="#"> Option 3</a></li> 
     <li><a href="#"> Option 4</a></li> 
    </ul> 
</li>

例如：當頂級選項1>選項1頁激活我想顯示的下拉菜單。它目前所做的只是顯示頂層菜單。由於其引導程序下拉，它將默認顯示，這是下拉菜單應該正常工作的正確方式。不知道我是否可以動態顯示它。無論用戶點擊該頁面還是該頁面上的其他內容，都應始終顯示此內容。

我正在ASP.NET應用程序中工作。我不確定這是否與活動標籤有關，或者如果我必須編寫一些javascript/jquery代碼才能獲取當前頁面並顯示相應的下拉菜單。

任何幫助非常感謝。

的jsfiddle：jsfiddle.net/yZ8C6

來源

2013-08-01 dannmate

您可以創建問題的http://jsfiddle.net嗎？這將使它更容易在... – Beno

http://jsfiddle.net/yZ8C6/ - CSS只是一個默認的，而不是我的網站上的實際CSS。但功能是一樣的。 – dannmate

好吧，我會說，我不能讓它在的jsfiddle正常工作，因爲它不會重新加載頁面時指定的鏈接前言本然而被點擊，我相信這將有助於

$('.dropdown-menu li a').each(function() { 
    if($(location).attr('href').indexOf($(this).attr('href')) > 0) { 
     $('.dropdown-menu').show(); 
    } 
});

所以我們在這裏所做的是檢查各列表項的鏈接href和檢查，如果它包含在頁面的鏈接中。如果其中任何一個匹配，則會將下拉列表設置爲顯示。由於引導使用visibility和show()使用display:block，該show()應該重寫visibility: hidden當你停止徘徊

看你怎麼走 - 你可能需要稍微修改它爲自己的目的

http://jsfiddle.net/yZ8C6/1/

你可以如果您點擊其中一個鏈接，然後重新加載輸出框架，只需單擊其中一個小工具即可工作

來源

2013-08-01 06:39:02 Beno

今天會放棄它，你的回答看起來很合理，但我將不得不像你說的那樣調整它。 – dannmate

else語句對可見性的可見性有什麼意義？我有一個問題，我的菜單中有多個下拉菜單，並且我已經成功編碼，根據您的代碼單獨顯示每個菜單:)。但是當你點擊另一個下拉菜單時，我仍然想要菜單的功能，我們剛剛顯示的固定一個應該消失，另一個應該只在菜單點擊時顯示。因爲目前它們彼此重疊。 – dannmate

你是對的 - 沒有意義。我會編輯答案。我原來在那裏，但忘了把它拿出來 – Beno

始終顯示自舉下拉列表中的項目，該項目被點擊或導航時

回答

相關問題