如何在关闭时删除所有jQuery UI对话框 [英] How to remove all of a jQuery UI dialog when it is closed

问题描述

在我的主页上，我有一种可以打开和关闭的侧面板。侧面板通过jQuery的加载功能加载到主页面上的div中。

On my main page I have a sort of side panel that can be opened and closed. The side panel is loaded via jQuery's load function into a div on the main page.

加载到此侧面板的部分内容是div（myDialog）

Part of the content that is loaded into this side panel is a div(myDialog)

当按钮时点击这个侧面板我打电话：

When a button is clicked on in this side panel I call:

$("#myDialog").dialog({
  title : "Permission",
  width : 300,
  height : 200,
  modal : true
});

现在，如果我关闭侧面板并使用jQuery的空函数清除其内容。然后我选择all和'view source'jQuery在身体底部添加的html仍然存在。当我重新打开侧面板并尝试打开相同的对话框时会出现问题，因为有两个div（有重复的ID）。

Now if I close the side panel and clear its contents with jQuery's empty function. Then I select all and 'view source' the html that jQuery added at the bottom of the body is still there. This causes problems when I reopen the side panel and try to open the same dialog because there are two of that div(with duplicate IDs).

我试过添加这个但是它不起作用：

I have tried adding this but it doesn't work:

close : function(){
    $("#myDialog").dialog("destroy");
}

如何清除jQuery添加到正文底部的html？或者有更好的方法来做我想要做的事情吗？

How can I clear that html that jQuery adds to the bottom of the body? Or is there a better way to do what I am trying to do?

推荐答案

jQueryUI实际上将div移动到DOM中的其他位置创建一个对话框，从而将其从原始容器中移出。因此，如果您尝试在其原始容器上调用 empty（），则无效。

jQueryUI actually moves the div elsewhere in the DOM when a dialog is created, thus moving it out from its original container. So, if you tried to call empty() on its original container it wouldn't work.

您应该在侧面板关闭时删除对话框div，而不是在对话框关闭时删除（如果对话框从未打开过，该怎么办）。

You should remove the dialog div when the side panel is closed, not when the dialog is closed (what if the dialog was never opened).

这篇关于如何在关闭时删除所有jQuery UI对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！