jQuery .dialog("close") 和 .dialog("destroy") 的区别

Difference Between .dialog("close") and .dialog("destroy")

提问by zzlalani

What is the difference between .dialog("close")and .dialog("destroy")in jquery-ui?

jquery-ui 中.dialog("close")和之间有什么区别.dialog("destroy")？

I have a script where the previous developer had used .dialog("destroy")but now I've to perform some actions once the dialog is closed. I've found beforeclosethat is called with .dialog("close")and not with .dialog("destroy"). So I've to change the method from destroyto closeto make it work.

我有一个以前的开发人员使用过的脚本，.dialog("destroy")但现在我必须在对话框关闭后执行一些操作。我发现beforeclose它被称为 with.dialog("close")而不是 with .dialog("destroy")。所以我必须将方法从destroy改为close以使其工作。

So is there anything that I'll miss if I use .dialog("close")and not .dialog("destroy")?

那么如果我使用.dialog("close")而不是我会错过.dialog("destroy")什么吗？

PS: The dialog is using custom buttons to close itself, and the .dialog("close")is called on the click event of the button

PS：对话框使用自定义按钮关闭自身，.dialog("close")在按钮的点击事件上调用

回答by Alnitak

closeleaves the dialog configured, but invisible, so you can reopen it again with .dialog('open').

close保留已配置的对话框，但不可见，因此您可以使用 重新打开它.dialog('open')。

destroywill completely deconfigure the dialog box. It'll remove all of the UI elements that were added to the DOM, and any related event handlers.

destroy将完全取消配置对话框。它将删除所有添加到 DOM 的 UI 元素以及任何相关的事件处理程序。

destroywill notremove the element that held the contentsof the dialog box (i.e. the element that you call .dialogon)

destroy将不删除举行的元素内容的对话框（即调用元素.dialog上）

回答by Brunis

Remember if you are using the dialog for forms input, that destroying it will NOT remove your input, so if you are validating with the :input pseudo selector, the elements you 'destroyed' will be validated. This is where .remove() comes in handy.

请记住，如果您将对话框用于表单输入，那么销毁它不会删除您的输入，因此如果您使用 :input 伪选择器进行验证，您“销毁”的元素将被验证。这就是 .remove() 派上用场的地方。

You can add a custom close event that destroys your dialog and removes any form inside it to prevent further validation of it.

您可以添加一个自定义关闭事件，该事件会破坏您的对话框并删除其中的任何表单以防止对其进行进一步验证。

$dialog = $("#your_dialog_id");
$dialog.dialog('option', {
    title: "title",
    close: function (event, ui) {
        $dialog.find("form").remove();
        $dialog.dialog('destroy');
    }
});

回答by Praveen

From Docs:

从文档：

destroy:

Removes the dialog functionality completely. This will return the element back to its pre-init state.

close:

Closes the dialog, which can re-opened when needed.

破坏：

完全删除对话框功能。这将使元素返回到它的预初始化状态。

关闭：

关闭对话框，可在需要时重新打开。