对话框没有完全关闭，为什么？答案

【问题标题】：Dialog box didn't complete close, why not?对话框没有完全关闭，为什么？
【发布时间】：2015-10-20 01:43:45
【问题描述】：

在父页面上有按钮单击打开加载另一个网页的 jQuery UI 对话框。在子页面上有“关闭”按钮来关闭对话框。我可以在对话框中加载子页面，但有一些问题。我搜索了许多网站（尝试使用销毁并删除对话框，打开或实时单击按钮）并没有找到解决方案。希望有人可以帮助我解决它。提前致谢。

有我的问题：

对话框打开后父页面的打开按钮消失
单击对话框上的“关闭”按钮后，对话框关闭，但即使我将显示更改为无，也会显示 div。

有父：

点击子页面的关闭按钮后。

有我的父页面代码：

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Test.aspx.vb"    Inherits="COMM.Test" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test</title>
   <link rel="stylesheet" href="/include/jquery-ui-themes-1.11.4/themes/smoothness/jquery-ui.css" />
    <script language="javascript" src="/include/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script language="javascript" src="/include/jquery-ui-1.11.4/jquery-ui.js" type="text/javascript"></script>
     <script language="javascript" src="/include/dailog.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $('#btnOpen2').click(function (e) {          
            e.preventDefault();
            openDailog();
        });
    });

  </script>
</head>
<body>
    <form id="form1" runat="server">
       <div><h1>Test</h1>
       <div id="somediv" />
          <button id="btnOpen2"> Open 2</button> 
     </div>
    </form>
  </body>
 </html>

子页面：

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="TestClose.aspx.vb" Inherits="COMM.TestClose" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
 <link rel="stylesheet" href="/include/jquery-ui-themes-1.11.4/themes/smoothness/jquery-ui.css" />
    <script language="javascript" src="/include/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script language="javascript" src="/include/jquery-ui-1.11.4/jquery-ui.js" type="text/javascript"></script>
     <script language="javascript" src="/include/dailog.js" type="text/javascript"></script>

  <script type="text/javascript" language="javascript">
  $(document).ready(function () {
      $('#btnClose').click(function (e) {
            e.preventDefault();
          closeDailog();       
      });

  });
    </script>
</head>
<body>
  <form id="form1" runat="server">
    <div>
        <button id="btnClose"> close</button> 
   </div>
  </form>
 </body>
</html>

有我的js代码：

function openDailog() {

$("#somediv").load('TestClose.aspx').dialog({
    autoOpen: false,
    modal: true,
    dialogClass: 'dialog',
    resizable: false,
    width: 500,
    height: 400,
    title: 'Close diaglog'
  });
  $("#somediv").dialog("open");
  return false;
}

function closeDailog() {

$('#somediv').dialog({
    autoOpen: false,
    modal: true,
    dialogClass: 'dialog',
    resizable: false,
    width: 500,
    height: 400

});

   $("#somediv").dialog("close");  
   $(".ui-dialog-titlebar").hide();
   $("#somediv").css("display", "none");


}

【问题讨论】：

标签： jquery asp.net

【解决方案1】：

由于“打开 2”按钮在 div 中，因此在加载完成后会被移除。

W3 Schools Load example 在加载新内容时会删除 div 中的内容。

至于第二点，加载子页面并没有改变，为什么删除后会有一个？

虽然您可以使用 HTML5 中的 localStorage 项传递一个标志来触发父页面的重新加载，但您可能会遇到让子页面重新加载父页面的挑战。我怀疑您可以清空其 HTML 的“somediv”div 来清除页面。

【讨论】：

我想要子页面（对话框完全消失）和父页面重新加载。
如果只关闭对话框，我将div上的显示更改为none，但它没有做对。