[英]I tried to add a Bootstrap dropdown button to <a> but the dropdown menu wont work. How do I do this?
<li><a href="#" class=" dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">CONTACT<span class="caret"></span></a>
</li>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
Can someone please help me. 有人可以帮帮我吗。 everything in is from bootstrap's website.
一切都来自bootstrap网站。 Heres the whole html file http://pastebin.com/YXsVPRhz
这是整个html文件的http://pastebin.com/YXsVPRhz
You're missing the data-target
from the a.dropdown-toggle
, and an id
for the targeted ul
. 您缺少
a.dropdown-toggle
的data-target
,以及目标ul
的id
。
For the a
, add a data-target attribute which is the id of the ul
: 对于
a
,添加一个data-target属性,它是ul
的ID:
data-toggle="dropdown" //sample name
For the ul
, add an id: 对于
ul
,添加一个ID:
id="dropdown" //sample name
so it should be: 所以应该是:
<li><a href="#" class=" dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" data-target="dropdown-menu" aria-expanded="true">CONTACT<span class="caret"></span></a>
</li>
<ul class="dropdown-menu" id="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
Add the ul
as a sibling of the anchor 将
ul
添加为锚的同级
<li>
<a href="#" class=" dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">CONTACT<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a>
</li>
</ul>
</li>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.