模态窗口的触发按钮不能使用图标

时间:2013-09-29 18:03:55

标签: twitter-bootstrap modal-dialog

你好我的模态窗口触发按钮有问题。如果我在其中放置一个图标,我就无法点击按钮。我该怎么办?

<button type="button" data-toggle="modal" data-target="#modal_help" 
        class="btn btn-inverse" title="Help">
    <i class="icon-question-sign icon-white"></i>
</button>

1 个答案:

答案 0 :(得分:1)

试试这个,演示here

 <button type="button" data-toggle="modal" data-target="#modal_help" class="btn btn-inverse" title="Help">
  <i class="icon-question-sign icon-white"></i>
</button>

<!-- Modal -->
<div id="modal_help" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
    </div>
    <div class="modal-body">
    <p>One fine body…</p>
    </div>
    <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
    </div>
</div>

您必须添加bootstrap.css

<link rel="stylesheet" href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css"/>

jquery.jsbootstrap.js

<script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script>