模态中的模态 - 关闭按钮关闭两个模态答案

【问题标题】：Modal in modal - close button closes both modals模态中的模态 - 关闭按钮关闭两个模态
【发布时间】：2015-02-23 19:50:22
【问题描述】：

我使用这段代码，在模态中创建一个模态 http://jsfiddle.net/4w34e4q6/

打开第一个模态

<div class="modal fade" id="one">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <h4 class="modal-title">Modal title</h4>
  </div>
  <div class="modal-body">
    <p>One fine body&hellip;</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#two">Open second modal</button>
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
   </div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="two">
  <div class="modal-dialog">
   <div class="modal-content">
    <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <h4 class="modal-title">Modal title</h4>
  </div>
  <div class="modal-body">
    <p>One fine body&hellip;</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  </div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

它在第二个模态中带有一个关闭按钮，它应该只关闭那个模态而不是第一个，但是它关闭了两个模态。

有什么我需要添加到此代码或 js 中的吗？

谢谢！

【问题讨论】：

它似乎在这里按预期工作 - jsfiddle.net/unto9g0L
我更新了你的小提琴以使用 jquery 和 bootstrap，然后点击运行，它工作正常。
作为提示，Bootstrap 建议不要同时拥有两个模态：“不支持重叠的模态：确保不要在另一个仍可见时打开一个模态。显示超过一次一个模式需要自定义代码。” getbootstrap.com/javascript/#modals

标签： twitter-bootstrap bootstrap-modal

【解决方案1】：

这可能是预期的行为，但您可以尝试解决它：

data-dismiss="two"

调用对象的ID。如果这不起作用，您可能必须使用自己的 js 方法：

Onclick="$('#two').hide();"

或类似

【讨论】：