dropdown menu that has a sub-dropdown menu in bootstrap

问题

I am new with bootstrap, and I have a problem in my dropdown menu to have a sub-dropdown menu. I try to run this code but it seems not working.

<div class="tabbable mainMenu visible-phone btn-group">
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                Menu
                <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">Submenu 1</a></li>
                    <li>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        Menu Down
                        <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu">
                            <li>Submenu 1</li>
                        </ul>
                    </li>
                </ul>
            </div>

when I click the Menu it shows the dropdown menus then when I click the Menu Down it didn't show its sub-dropdown menu but the dropdown menu were gone.

did I do something wrong in my code? any help will be appreciated.. thanks in advance

回答1:

I think you have to add class ".dropdown-submenu" to the "li" where you are going to keep the submenu. It's shown below:

<li class="dropdown-submenu">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
         Menu Down
         <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
         <li>Submenu 1</li>
    </ul>
</li>

Hope this helps.

来源：https://stackoverflow.com/questions/15850836/dropdown-menu-that-has-a-sub-dropdown-menu-in-bootstrap