如何使用最后一个弹出模态上的关闭按钮关闭多个 bootstrap 模态

Question

我在这段代码中有 2 个模态弹出窗口。我如何使用第二个弹出模态上的关闭按钮来关闭第一个和第二个模态。

<button class="btn btn-default"><a href="#" data-toggle="modal" data-target="#myModal">Open First Modal</a></button>
        <div class="modal fade reply-sure" id="myModal">
          <div class="modal-dialog  modal-lg">
            <div class="modal-content">
              <div class="modal-header bg-default">
                <h4 class="modal-title">First Modal</h4>
              </div>
              <div class="modal-body">
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal2">Open Second</button>
                <button type="button" class="btn btn-info"  data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade reply-sure" id="myModal2">
          <div class="modal-dialog  modal-lg">
            <div class="modal-content">
              <div class="modal-header bg-default">
                <h4 class="modal-title">Second Modal</h4>
              </div>
              <div class="modal-body">
                <button type="button" class="btn btn-danger"  data-dismiss="modal">Close all</button>
              </div>
            </div>
          </div>
        </div>

Answer 1

您可以使用 $('#myModal, #myModal2').modal('hide');.

http://jsfiddle.net/L5o2pm1g/

Answer 2

Bootstrap 使您可以访问模态函数的额外功能。您所要做的就是 select 它和 jQuery 然后告诉它该做什么。请参阅下面的代码段。

function closeAll() {
  $('#myModal, #myModal2').modal('hide');
}

<button type="button" class="btn btn-danger" data-dismiss="modal" onClick="closeAll()">Close all</button>

如何使用最后一个弹出模态上的关闭按钮关闭多个 bootstrap 模态

How can I close multiple bootstrap modals with the close button on the last popped modal

javascript

jquery

modal-dialog

twitter-bootstrap