Question

我在这里设置了Bootply测试设置：http://bootply.com/67311

当我点击“X”或“关闭”按钮时，它按预期工作。但是，我希望它在用户遇到转义时关闭/关闭，或者在模态对话框外点击。

我该怎么做？

Answer 1

非常感谢“tabindex =” - 1“

有同样的问题。我检查了bootstrap.js中的代码（模态部分） - 看起来像某个事件（whitch escape功能使用）并不会触发。我希望尽快解决它。

我得到了BS3 RC2，鼠标点击完美地在那里工作

<!-- Button trigger modal -->
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a>

<!-- Modal -->
<div class="modal" id="myModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                ...
            </div>
            <div class="modal-footer">
                <a href="#" class="btn">Close</a>
                <a href="#" class="btn btn-primary">Save changes</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

Answer 2

所以我使用这段代码并且有效：

  <div class="modal hide fade" id="modalCreate">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      <h3>Create a new App</h3>
    </div>
    <div class="modal-body">
      Body stuff here

    <div class="modal-footer">
      <button type="submit" class="btn btn-primary">Save</button>
      <button class='btn btn-danger' data-dismiss='modal' aria-hidden='true'>Cancel</button>
    </div> 
  </div>

还要确保在文件中包含bootstrap.js

Bootstrap 3.0模态 - 如何使用ESC解除或单击外部模态？

2 个答案: