我正在使用 Jquery UI 来显示选项卡。在其中一个选项卡中,我有一个对话框。如果我导航到该选项卡,打开对话框,关闭它,离开该选项卡然后再次返回并打开对话框,我最终会在 DOM 中看到多个重复的 HTML 元素。
换句话说...
我已经使用选项卡设置了主页:
<div id="groupTabs" style="width:600px; height:600px; display:none">
<ul>
<li><a href="tab1.aspx"><span>Info</span></a></li>
<li><a href="tab2.aspx"><span>Associations</span></a></li>
</ul>
</div>
选项卡 #2 包含一个对话框:
<div id="dgEvent">
<input id="someId">
</div>
...
$("#dgEvent").dialog();
我发现,如果我打开对话框,导航离开(到另一个选项卡)然后再次返回,下次打开对话框时,我最终会在 DOM 中看到名为“someId”的重复元素。这会导致问题,因为当我尝试从 someID 获取值(即 $("#someID").val() 时,我最终会从对话框的第一个实例获取值。)
是否有修复程序可以确保关闭对话框时删除这些字段?或者更好的是,当导航到另一个选项卡时,它们会被正确删除?
编辑
最后,我认为问题与选项卡和对话框一起使用有关。当我离开选项卡时,表单上位于对话框之外的任何字段都会从 DOM 中删除。但是,在我离开后,对话框中的任何内容都会保留在 DOM 中。因此,当我向后导航时,我最终得到了重复项。
最佳答案
使用
$('#your-dialog').dialog('destroy').remove();
销毁对话框,然后使用 remove()
从 DOM 中删除 div 及其子元素。
问候。
关于Jquery Dialog - 多次添加到 DOM 的对话框字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4740500/