Question

我用过两个弹出窗口，例如“Launch first”和“Launch second”。

当我点击打开“Launch first”弹出窗口时，我们也可以选择打开“Launch second”弹出窗口。

我需要点击“启动第二个”弹出窗口，“启动第一个”弹出窗口关闭，“启动第二个”弹出窗口内容加载到“启动第一个”div。

HTML文件：

<a href="first.html" data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch First</a>
    <a href="second.html" data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch Second</a>

    <div class="modal fade hide" id="myModal" 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>

JS文件：

$('#myModal').on('hidden', function () {
  $(this).removeData('modal');
});

示例链接：

http://plnkr.co/edit/oZ304D7oPDKygDG05EWa?p=preview

Answer 1

尝试这样的事情：

 $('.modal-footer .btn').on('click', function (e) {
      e.preventDefault();

        $('.modal-body').load('second.html');
        $('.modal-footer .btn').hide();
    });

http://plnkr.co/edit/FqAvP9ZRpiybigiNc5oj?p=preview

如何将打开弹出模型内容的内容替换为新的弹出模型

1 个答案: