Question

我有一个表格中的数据列表和每行旁边的按钮。当我点击按钮时，模态会将相关的远程URL加载到模态中。

我在所述模式中的提交按钮包含以下jQuery：

$('#editTrackModal').modal('hide');

当模态隐藏，并且我将另一个远程URL加载到模态中时，模式会出现，但在较慢的互联网连接上，模态的原始内容有时会在被替换之前保留4-5秒。

基本上，我不想隐藏，而是想隐藏和摧毁＆＃39;模态，然后重新创建它。

这可能吗？

按下按钮后简单地破坏模态会关闭窗口，但是在页面重新加载之前不允许后续模态重新打开。

Answer 1

你可以清理模态的内容，在显示之前，我不知道你如何加载内容，你可以使用这样的东西：

$("#editTrackModal .modal-body").empty();

Answer 2

嗨，你可以这样做

// the modal is distroyed on hide event..
$('#editTrackModal').on('hidden', function(){
    $(this).data('modal', null); //this will destroy you data and model means it will reset.
});

可能与 how to destroy bootstrap modal window completely?

重复

您也可以参考该链接。

Answer 3

在隐藏/关闭模式后，确保模态内容清晰的好方法可以这样做：

$('#editTrackModal').on('hidden.bs.modal', function () {
    $('#editTrackModal div').remove(); //When the hidden event is triggered, remove all the contents of the modal.
});

当你想再次show模态时，你可以这样做：

$('#editTrackModal').append($('.modal-contents')); //create first the contents of the modal, then attach it.
$('#editTrackModal').modal('show');

您的HTML可能如下所示：

<div id="editTrackModal" class="modal fade">
    <div class='modal-contents'>
        ......Build your modal contents here......
    </div>
</div>

Destory CSS Bootstrap Modal

3 个答案: