我正在开发一个bootstrap导航栏。请找到附带的原型。一切都按预期工作。我想在标签中打开子菜单。谁能提出一些关于如何进行的想法?悬停时会打开下拉列表。
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<div class="container">
<ul class="nav navbar-nav">
<li data-omni_link="x1" id="xyz" ><a href="#" class="role-link"><span class=""><i class="icon "></i></span><span data-omni_data="tile_position:1" class="">Nav1</span></a></li>
<li data-omni_link="x2" id="abc" ><a href="#" class="role-link"><span class=""><i class="icon"></i></span><span data-omni_data="tile_position:2" class="">Nav2</span></a></li>
<li class="dropdown middle-button" id="fgh">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class=""><i class="icon "></i></span><span data-omni_data="tile_position:4" class="">Nav3<b class="caret"></b></span></a>
<ul class="dropdown-menu">
<li class="kopie"><a href="#">Dropdown2</a></li>
<li><a href="#">Dropdown2 Link 1</a></li>
<li><a href="#">Dropdown2 Link 2</a></li>
<li><a href="#">Dropdown2 Link 3</a></li>
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown2 Link 4</a>
<ul class="dropdown-menu">
<li class="kopie"><a href="#">Dropdown2 Link 4</a></li>
<li><a href="#">Dropdown2 Submenu Link 4.1</a></li>
<li><a href="#">Dropdown2 Submenu Link 4.2</a></li>
<li><a href="#">Dropdown2 Submenu Link 4.3</a></li>
<li><a href="#">Dropdown2 Submenu Link 4.4</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown2 Link 5</a>
<ul class="dropdown-menu">
<li class="kopie"><a href="#">Dropdown Link 5</a></li>
<li><a href="#">Dropdown2 Submenu Link 5.1</a></li>
<li><a href="#">Dropdown2 Submenu Link 5.2</a></li>
<li><a href="#">Dropdown2 Submenu Link 5.3</a></li>
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4</a>
<ul class="dropdown-menu">
<li class="kopie"><a href="#">Dropdown2 Submenu Link 5.4</a></li>
<li><a href="#">Dropdown2 Submenu Link 5.4.1</a></li>
<li><a href="#">Dropdown2 Submenu Link 5.4.2</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li data-omni_link="rww" id="AD">
<span class="">NAV4 </span><input maxlength="5" data-storage="" data-omni_data="tile_position:6, link_name:" type="text" id=""><button class="unstyled" data-omni_data="link_name:zip_code_edit" id=""><i class="icon icon-pencil"></i><i class="icon icon-arrow-r"></i></button>
</li>
</ul>
</div>
</div><!-- /.navbar-collapse -->
</nav>