ASP.NET Web窗體事件處理程序在加載後修改頁面組件

Question

我正在顯示加載圖像，直到頁面加載完成，我想再次顯示此圖像，直到按鈕單擊事件處理程序完成。但是由於asp.net網頁中的頁面生命週期，我無法做到這一點。有關如何做的建議？

Answer 1

一個選項是使用更新面板，儘管你也可以通過jquery實現這一點。在更新後的面板中，您可以使用加載指示器的div，然後當您點擊該按鈕時，該按鈕會顯示出來，請嘗試。

的榮譽屬於嗨，你使用asp.net表單或MVC此鏈接http://www.aspsnippets.com/Articles/Show-Loading-Progress-Indicator-using-GIF-Image-when-UpdatePanel-is-updating-in-ASPNet.aspx

<asp:ScriptManager runat="server"> 
     </asp:ScriptManager> 
     <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1"> 
     <ProgressTemplate> 
      <div class="modal"> 
       <div class="center"> 
        <img alt="" src="loader.gif" /> 
       </div> 
      </div> 
     </ProgressTemplate> 
     </asp:UpdateProgress> 
     <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate> 
      <div align="center"> 
       <h1> 
        Click the button to see the UpdateProgress!</h1> 
       <asp:Button ID="Button1" Text="Submit" runat="server" OnClick="Button1_Click" /> 
      </div> 
     </ContentTemplate> 
     </asp:UpdatePanel> 


    protected void Button1_Click(object sender, EventArgs e) 
    { 
     System.Threading.Thread.Sleep(5000); 
    } 

// CSS

<style type="text/css"> 
body 
{ 
    margin: 0; 
    padding: 0; 
    font-family: Arial; 
} 
.modal 
{ 
    position: fixed; 
    z-index: 999; 
    height: 100%; 
    width: 100%; 
    top: 0; 
    background-color: Black; 
    filter: alpha(opacity=60); 
    opacity: 0.6; 
    -moz-opacity: 0.8; 
} 
.center 
{ 
    z-index: 1000; 
    margin: 300px auto; 
    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>