Question

如何从页面底部的HTML中为此菜单结构添加另一个级别？

当前

Test

--->a
--->b

我正在尝试做什么

Test

   --->a
           --->1
           --->2
   --->b
           --->1
           --->2

HTML

<li class="nav-header">
    <a data-target="#menu5" data-toggle="collapse" href="#">
    <h3>test</h3></a>
    <ul class="list-unstyled collapse" id="menu5">
        <li>
            <a href="#"><i class="glyphicon glyphicon-circle"></i> Facebook</a>
        </li>
        <li>
            <a href="#"><i class="glyphicon glyphicon-circle"></i> Twitter</a>
        </li>
    </ul>
</li>

Answer 1

<ul>
  <li class="nav-header">
                <a data-target="#menu5" data-toggle="collapse" href="#">
                <h3>test</h3></a>
                <ul class="list-unstyled collapse" id="menu5">
                    <li>
                        <a data-target="#submenu" data-toggle="collapse" href="#"><i class="glyphicon glyphicon-circle"></i> Facebook</a>
                        <ul class="list-unstyled collapse" id="submenu">
                           <li> 1 </li>
                           <li> 2</li>
                        </ul>
                    </li>
                    <li>
                        <a href="#"><i class="glyphicon glyphicon-circle"></i> Twitter</a>
                    </li>
                </ul>
  </li>
</ul>

我相信你只需要创建另一个具有唯一ID的折叠元素。使用<a>元素作为切换。

添加另一个级别 - 侧面菜单HTML / Boostrap 3 / JS

1 个答案: