如何使用新页面作为弹出源来创建弹出窗口？答案

【问题标题】：How can I create a pop-up window using a new page as the pop-up source?如何使用新页面作为弹出源来创建弹出窗口？
【发布时间】：2011-08-27 23:59:38
【问题描述】：

我想在单击“createbutton”时弹出一个面板，我正在使用一个面板并在面板内添加一些文本框和按钮。我可以通过在存在创建按钮的同一页面中设计弹出面板来制作弹出面板。我可以在单独的页面中弹出并使其在单击创建按钮时弹出

【问题讨论】：

标签： c# asp.net

【解决方案1】：

悟空，

是的，您可以将面板放在单独的页面中，并使其在您单击创建按钮时出现。这是另一种选择（不是我最喜欢的，但它不依赖于标准 javascript 之外的任何额外内容）：

当您单击“创建按钮”时，会打开一个新的浏览器窗口，该窗口已调整大小以完全匹配面板的大小。这可以使用 javascript 轻松完成，如下所示：
在您弹出的包含面板的页面上（page containsPanel.aspx - 根据我的示例），您可以使用代码在执行某些操作后关闭窗口。例如，如果您有一个按钮应该将一些数据保存到数据库并返回到父页面，您可以执行以下操作：

{

  ///Perform server side process. If successfully executed close this window. 
  protected void btnSubmit_Click(object sender, EventArgs e)
  if(EverythingOK) 
        { 
           StringBuilder cstext2 = new StringBuilder();
  cstext2.Append("<script type=\"text/javascript\"> function CloseMe() {");
  cstext2.Append("window.close();} </");
  cstext2.Append("script>");
  cs.RegisterStartupScript(cstype, csname2, cstext2.ToString(), false);
        } 

    }

【讨论】：

【解决方案2】：

当然。您可以创建一个 iframe，然后将源设置为您正在创建的面板。

假设你有两个 html 页面 panel.html 和 main.html

您的 panel.html 可以简单地是

<html>
   <body style="background-color:red">
      Hi!
   </body>
</html>

还有你的 main.html

    <html>
    <body style="background-color:yellow">
        <iframe src="panel.html" style="height:300px;width:300px;border:0px;display:none;" id="myPanel"></iframe>
        <a href="#" onclick="document.getElementById('myPanel').style.display='block';return false">Show Panel</a>
    </body>
</html>

这应该会显示一个带有“显示面板”超链接的黄色页面。当您单击显示面板时，它将显示您的 panel.html 的 iframe。

如果您使用的是 ASP.NET MVC，您可以通过创建一个可以使用一些 Ajax/JQuery 代码调用的视图来实现这一点。如果您正在寻找这种方法的东西，我可以为此发布一些代码。

【讨论】：