ASP UpdateProgress 不适用于 iframe答案

【问题标题】：ASP UpdateProgress not working with iframeASP UpdateProgress 不适用于 iframe
【发布时间】：2018-01-21 16:14:59
【问题描述】：

我正在使用 updateProgress 控件在我页面中的 iframe 加载时显示 loader.gif。

iframe 需要很长时间才能加载，但 loader.gif 没有出现

这是我的 aspx 页面

<!DOCTYPE html>
<head>
<title></title>
<style type="text/css">
    body {
        margin: 0;
        padding: 0;
        font-family: Arial;
    }

    .MyModal {
        position: fixed;
        z-index: 999;
        height: 100%;
        width: 100%;
        top: 0;
        filter: alpha(opacity=60);
        opacity: 0.6;
        -moz-opacity: 0.8;
    }

    .center {
        z-index: 1000;
        margin: 300px 400px 300px 400px;
        padding: 10px;
        width: 130px;
        background-color: White;
        border-radius: 10px;
        filter: alpha(opacity=100);
        opacity: 1;
        -moz-opacity: 1;
    }

        .center img {
            height: 128px;
            width: 128px;
        }
</style>
</head> 
<body>
  <form id="form1" runat="server">
    <h1>My Payment Page</h1>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
         <ProgressTemplate>
                        <div class="MyModal">
                            <div class="center">
                                <img alt="" src="images/my-loader.gif" />
                            </div>
                        </div>
                    </ProgressTemplate>
    </asp:UpdateProgress>

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                            <iframe id="frame1" runat="server" width="100%" height="600" scrolling="no" frameborder="0"></iframe>
            </ContentTemplate>
        </asp:UpdatePanel>

</form> </body> </html>

在我的代码隐藏文件中，我以编程方式设置 iframe 的源代码

protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
            frame1.Src = "http://example.com";
        }
    }

我不知道我错过了什么。

【问题讨论】：

标签： asp.net iframe updatepanel scriptmanager updateprogress

【解决方案1】：

UpdateProgress 控件用于部分页面更新（AJAX 请求）；他们不回复正常的回发。

要查看它的工作原理，请将按钮控件放在 UpdatePanel 中（内容模板）。因为它在更新面板中，所以它发出一个 AJAX 请求（基本上），所以 UpdateProgress 控件应该自动工作。

如果响应非常快，您可能看不到 UpdateProgress 控件的图像。为了进行测试，请在响应中添加一些时间，以便您可以看到图像。

protected void btn_Click(object sender, EventArgs e)
{
    // add a fake delay for testing.
    System.Threading.Thread.Sleep(3000);
}

【讨论】：