删除对话框不会删除其内部内容

我在该对话框中创建了一个对话框和一个UI选项卡。 在该选项卡中，我将一些内容显示为表格。 当我通过remove（）方法关闭对话框时它会关闭对话框但是当我重新打开它时，内容仍然显示在选项卡中，是否有任何方法在对话框关闭时内容也会重新显示。 下面是我的代码。

this.formOrderList = null; this.orderListDialogObject = $('
'); this.orderListTable = $('
' + '' + '' + '' + '' + '' + '' + '' + '' + '' + '
 Order# 
 Ref # 
' + '
'); this.orderListTabs = $('
' + '
' + '
Pending
' + '
' + '
' + '
' + '
'); this.show = function() { this.orderListDialogObject.dialog({ title : 'Order List', width : 1000, height : 150, close : function(ev, ui) { $(this).remove(); return false; } }); this.orderListTabs.tabs(); this.orderListTabs.appendTo(this.orderListDialogObject); $("#pendingOrderList", this.orderListTabs).append(this.orderListTable); 

Answer 1

您正在创建一次div，然后重复使用这些相同的实例。 你的remove调用只是从DOM树中删除了div（及其所有内容） – 你没有做任何能清除div内容的东西。

您可能应该：

1. 每次显示对话框时都会创建一组新的div – 即，每次要显示对话框时重新运行上述所有代码，而不是在前面执行一些代码。 这样，你每次都会以干净的名字开始。 要么，
2. 通过调用empty() ，在开始向其添加新内容之前清除一个或多个div的内容。

在大多数情况下，选项＃1可能更清洁，更容易维护。

Answer 2

你需要调用.dialog( "destroy" )才能完全删除它

Answer 3

您需要在窗口上调用destroy（然后将内容放回原处），然后使用类似$（“＃main”）的内容清空/删除内容.remove（）。