Question

我的结构如下。用于显示我的内容的Modal1和在删除时的警报模式时弹出Modal2。

我在Ajax中首次加载modal1
第二个模态不是Ajax调用。

这个结构有多个模态是否可取？否则，在模态中获取警报消息的替代方法是什么？因为现在我面临关闭模态和事件的奇怪问题。它工作了一段时间，有些时候没有。不确定是什么导致了这种怪异。任何有关做和不做的线索都会有所帮助。 https://plnkr.co/edit/ZaUfPntbVp3QMubaw8xg?p=preview

<button type="button" class="btn btn-info btn-lg" data-toggle="modal" 
data-target="#myModal">Open Modal</button>
 <!-- Modal -->
 <div class="modal fade" id="myModal" role="dialog">
 <div class="modal-dialog">

 <!-- Modal content-->
<div class="modal-content">
  <div class="modal-header">
  <button type="button" class="close" data-dismiss="modal">&times;</button>
  <h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
  <p>Some text in the modal.</p>
  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal2">Open Modal</button>
</div>
<div class="modal-footer">
  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Alert : Are you sure?</h4>
    </div>
    <div class="modal-body">
      <p>Some text in the modal.</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>

Answer 1

bootstrap 3不支持嵌套模式，这就是获得有线结果的原因

来自bootstrap docs：

不支持多个开放模式确保不打开模态，而另一个模态仍然可见。一次显示多个模态需要自定义代码。

而不是使用第二个模态您可以使用alert在第一个模态中显示通知消息

bootstrap多模态结构

1 个答案: