繁体   English   中英

我尝试向其中添加Bootstrap下拉按钮, <a>但下拉菜单无法正常工作。</a> <a>我该怎么做呢?</a>

[英]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>

有人可以帮帮我吗。 一切都来自bootstrap网站。 这是整个html文件的http://pastebin.com/YXsVPRhz

您缺少a.dropdown-toggledata-target ,以及目标ulid

对于a ,添加一个data-target属性,它是ul的ID:
data-toggle="dropdown" //sample name

对于ul ,添加一个ID:
id="dropdown" //sample name

所以应该是:

<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>

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM