如何顯示（塊/無）第二個菜單取決於第一次使用引導多選

Question

我有兩個類似的菜單。 如果我在第一個菜單中選擇Abon。它應該顯示Abon optgroup（Abon-1，Abon-2）下的所有li元素，如果我在第二個菜單中取消選中block應該消失。 選擇和選項是我的代碼。而另一碼由引導多選（LI，輸入複選框，等等）

<!-- first common --> 
<span class="multiselect-native-select"> 
<select name="emp_sel9[]" id="my_select_descr" multiple="multiple"> 
    <option value="-1">All</option> 
    <option value="1" style="padding-left: 15px;">Abon</option> 
    <option value="2" style="padding-left: 15px;">Client</option> 
</select> 
<div class="btn-group"> 
<button type="button" class="multiselect dropdown-toggle btn btn- 
default" 
data-toggle="dropdown" title="Abon, Client" aria-expanded="false"> 
<span class="multiselect-selected-text">Abon, Client</span> 
<b class="caret"></b> 
</button> 
<ul class="multiselect-container dropdown-menu"> 
    <li class="multiselect-item multiselect-all"> 
     <a tabindex="0" class="multiselect-all"> 
     <label class="checkbox"> 
     <input type="checkbox" value="multiselect-all">Select 
     All</label> 
     </a> 
    </li> 
    <li> 

全部代碼在這裏產生： http://jsfiddle.net/w7aakdbb/1170/

我有一個想法，以搜索使用find，兒童和sublings元素..但與它堆疊在一起。

Answer 1

我只是給你提示如何解決它。

獲取檢查元素，並將其顯示在下拉2

$(document).ready(function() { 
    $("#menu-1>li").on("click", function() { 
    var selected = $(this).text() 
    console.log(selected); 
    $("#menu-2>li").hide(); 
    $("#menu-2").find("li[data-value='abon']").show(); 
    }); 
}); 

這個例子是工作，當你選擇abon可以更加改善。 （或者我會更新，但後來，我將使其與複選框選擇更加動態的，不是text）

https://jsfiddle.net/princesodhi/8kfyd7ec/1/