Javascript jqueryui对话框，打开新对话框，关闭后面的对话框

我的网站有一个页脚，可以打开4个不同的对话框，并从独立页面加载内容

如果您从搜索引擎输入页脚页面或键入url，则可以单独打开页脚页面

我有一个打开页脚对话框的函数：

function FooterPopup(){
    $(document).ready(function(){
        $('#footerContactUs').on("click",function(){
            var $dialog=$('<div></div>').load($('#footerContactUs').attr('href')).dialog({
                close: function(event,ui){$(this).remove ();},
                autoOpen:false,
                width:700,
                height:610,
                resizable:'false',
                modal:true,
                show:'blind',
                hide:{effect:'blind',duration:300},
                dialogClass:'Contact'
            });
            $dialog.dialog('open');
            return false;
        });
    })
}

函数FooterPopup（）{
$（文档）.ready（函数（）{
$（'#footerContactUs'）。在（“单击”，函数（）{
var$dialog=$（''）.load（$（'#footerContactUs'）.attr（'href'））.dialog({
关闭：函数（事件，ui）{$（this.remove（）；}，
自动打开：错误，
宽度：700，
身高：610，
可调整大小：'false'，
莫代尔：是的，
秀：'盲'，
隐藏：{效果：'blind'，持续时间：300}，
dialogClass:“联系人”
});
$dialog.dialog（'open'）；
返回false；
});
})
}

独立页面具有以不同功能打开另一个对话框的链接

所以我有两种情况：

1.对话框将在另一个对话框的顶部打开

2.对话框从独立页面打开

代码：

函数咨询（）{
$（文档）.ready（函数（）{
$（'.ConsultHotels'）。在（“单击”，函数（）上）{
var$dialog=$（''）.load（$（'.ConsultHotels'）.attr（'href'））.dialog({
莫代尔：是的，
关闭：函数（事件，ui）{$（this.remove（）；
$（'.ui datepicker'）.remove（）；}，
自动打开：错误，
宽度：750，
身高：590，
可调整大小：'false'，
秀：'盲'，
隐藏：{效果：'blind'，持续时间：300}，
打开：函数（事件，ui）{$（'body'）。查找（'.ui对话框内容'）。eq（0）。对话框（“关闭”）；}，
dialogClass:'ConsultClass'
});
$dialog.dialog（'open'）；
返回false；
});
});
}

我的问题是，我不知道如何在第一种情况下关闭“家长”对话框，而在第二种情况下不关闭对话框

请帮忙

---

谢谢。

为什么不在打开新对话框之前关闭所有打开的对话框

$('.ConsultHotels').on("click",function(){
  // first close any open dialogs.  This approach is used in stead of just doing a .hide()
  //  because it will invoke any dialog close callbacks.
  $('.ui-dialog-titlebar-close:visible').click(); 

  // now initialize your dialog.
  var $dialog = $('<div></div>').load($('.ConsultHotels').attr('href')).dialog();
});

$（'.ConsultHotels'）。在（“单击”，函数（）上）{
//首先关闭所有打开的对话框。使用这种方法，而不仅仅是执行.hide（）
//因为它将调用任何对话框关闭回调。
$（'.ui对话框标题栏关闭：可见'）。单击（）；
//现在初始化对话框。
var$dialog=$（''）.load（$（'.ConsultHotels'）.attr（'href'））.dialog（）；
});

你知道你不需要这些函数中的

$（document）.ready（function（）{

）。唯一的问题是当我关闭第一个对话框并打开第二个对话框时，.ui小部件覆盖没有出现。可能是因为我在第一个对话框中执行-close:function（event，ui）{$（this）.remove（）；}？我如何获得“.ui小部件覆盖”返回？在删除对话框小部件之前销毁它，否则它仍将在内存中初始化。$（this）.dialog（“Destroy”）.remove（）；确定，但它仍然不会在第二个对话框中打开“.ui小部件覆盖”，尽管“modal:true”。您使用的是哪个版本的jquery ui？它在这种情况下似乎工作得很好：确保您也删除了开放事件处理程序？如果它仍然不工作，您是否可以创建一个重现问题的JSFIDLE？

$('.ConsultHotels').on("click",function(){
  // first close any open dialogs.  This approach is used in stead of just doing a .hide()
  //  because it will invoke any dialog close callbacks.
  $('.ui-dialog-titlebar-close:visible').click(); 

  // now initialize your dialog.
  var $dialog = $('<div></div>').load($('.ConsultHotels').attr('href')).dialog();
});