twitter-bootstrap Twitterbootstrap 下拉菜单，打开模式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28720843/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitterbootstrap dropdown, open modal
提问by Bernie
Trying to get a dropdown button to open, and then when clicking on an item in the dropdown it should open a modal - but not working, added this code:
尝试打开下拉按钮，然后单击下拉菜单中的项目时，它应该打开一个模式 - 但不起作用，添加了以下代码：
<button type="button" class="btn btn-lg btn-warning dropdown-toggle" data-toggle="dropdown">By industries <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#consumergoods">Consumer goods</a></li>
<div class="modal fade" id="consumergoods" data-target="#consumergoods">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header orange">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title"><strong></strong>Consumer goods</h4>
</div>
Probably doing something seriously wrong, but I'd be glad if someone could help, thanks!
可能做错了什么，但如果有人能提供帮助，我会很高兴，谢谢！
回答by anpsmn
You need to have a wrapper div .dropdownfor the buttonand <ul>for the dropdown to work and for the modal you need to give the attribute data-toggle="modal"to the link
你需要有一个包装DIV.dropdown的button，并<ul>为下拉到工作和模态，你需要给该属性data-toggle="modal"的链接
<div class="dropdown">
<button type="button" class="btn btn-lg btn-warning dropdown-toggle" data-toggle="dropdown">By industries <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#consumergoods" data-toggle="modal">Consumer goods</a></li>
</ul>
</div>
<div class="modal fade" id="consumergoods" data-target="#consumergoods">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header orange">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title"><strong></strong>Consumer goods</h4>
</div>
</div>
</div>
</div>
