javascript - 单个ajax页面仪表板上的jquery模式复制

Question

我有一个问题，我在某个 ajax 请求中有 5 个 jquery 对话框。此页面不会重新加载，并且完全依赖于 ajax。一旦这个特定的 ajax 请求与 5 个对话框一起加载，它们就会被初始化，并且插件会在页面底部为对话框添加必要的标记。我通过 ajax 离开该页面以转到另一个 ajax 请求。从模态生成的 html 仍然在页面上。如果我再次回到有这 5 个对话框的页面，它会在底部的 html 中添加另外 5 个模态，所以现在是 10 个。在导航 ajax 页面时，有没有一种好方法可以删除这些模态，或者我有跟踪它？有一些对话框是全局的，并且被每个 ajax 请求使用，所以全局删除也不起作用。

Answer 1

我做了一些孤独的答案给出的，但我已经有一个关于这些模态的通用课程，所以我这样做了。

$(".modal-template").parents('.ui-dialog').remove();

Answer 2

给每组对话框一个唯一的类——也许是“set”+一个唯一的、递增的变量。在增加变量之前，调用，例如$('.set' + incrementVal).dialog("destroy");，在创建新对话框之前消除旧对话框。这听起来会奏效吗？

例如：

globalIncrement = 0;
function createDialogs() {
    globalIncrement += 1;
    $('div#main').append('<div class="set' + globalIncrement + '">test Dialog</div>');
    if(globalIncrement > 1) {
        $('div.set' + (globalIncrement - 1)).dialog("destroy");
        //Also, remove the <div> from the DOM:
        $('div.set' + (globalIncrement - 1)).remove();
    }
}