销毁 CSS 引导模式答案

【问题标题】：Destory CSS Bootstrap Modal销毁 CSS 引导模式
【发布时间】：2015-07-07 11:34:31
【问题描述】：

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

我在上述模式中的提交按钮附加了以下 jQuery：

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

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

基本上，我想“隐藏和销毁”模态，然后重新创建它，而不是隐藏。

这可能吗？

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

【问题讨论】：

能否提供更多代码，如何加载远程 URL？

标签： javascript jquery css twitter-bootstrap

【解决方案1】：

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

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

【讨论】：

【解决方案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?

重复

你也可以参考那个链接。

【讨论】：

【解决方案3】：

在隐藏/关闭后确保模态内容干净的好方法可以这样做：

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

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

$('#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>

【讨论】：