頁面加載期間的模態彈出有時不隱藏：ASP.NET C＃Javascript jquery

我有一個ajax模式彈出窗口，在頁面加載過程中顯示，然後它隱藏頁面加載完成時，所有此代碼需要放置在母版頁中。問題在於，對於一些按鈕點擊，它們不會觸發javascript事件window.onload被調用，或者頁面加載完成或在asp中呈現事件。他們只會調用before unload事件並提交事件。當發生這種情況時，我注意到彈出窗口沒有隱藏，因爲沒有調用window.onload。否則它奇妙地工作。有沒有人知道一種方法，我可以確保彈出窗口始終隱藏，而不必隱藏每個按鈕上的彈出窗口都會點擊不重新加載整個頁面的代碼？請參閱下面的代碼。頁面加載期間的模態彈出有時不隱藏：ASP.NET C＃Javascript jquery

母版頁：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="OnlinePrizing.SiteMaster" %> 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %> 

<!DOCTYPE html > 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head runat="server"> 
    <title></title> 
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" /> 

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    function showPopup(who) { 
     console.log("show called: " + who); 
     var modalPopupBehavior = $find('programmaticModalPopupBehavior'); 
     modalPopupBehavior.show(); 
    } 
    function hidepopup(who) { 
     console.log("hide called: " + who); 
     var modalPopupBehavior = $find('programmaticModalPopupBehavior'); 
     modalPopupBehavior.hide(); 
    } 

    window.onbeforeunload = function() { 
     showPopup('window.onbeforeunload'); 
    }; 

    window.onsubmit = function() { 
     showPopup('window.onsubmit'); 
    }; 

    window.onload = function() { 
     hidepopup('window.onload'); 
    }; 
    </script> 
    <style type="text/css"> 
.modalBackground { 
    background-color:Blue; 
    filter:alpha(opacity=30); 
    opacity:0.3; 
} 
.modalPopup { 
    background-color:white; 
    border-width:3px; 
    border-style:solid; 
    border-color:Gray; 
    padding:3px; 
    width:250px; 
} 
</style> 
    <asp:ContentPlaceHolder ID="HeadContent" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 
    <form runat="server"> 
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" EnablePartialRendering="true" runat="server"></asp:ToolkitScriptManager> 
    <asp:Button runat="server" ID="hiddenTargetControlForModalPopup" style="display:none"/> 
     <asp:ModalPopupExtender runat="server" ID="programmaticModalPopup" 
      BehaviorID="programmaticModalPopupBehavior" 
      TargetControlID="hiddenTargetControlForModalPopup" 
      PopupControlID="programmaticPopup" 
      BackgroundCssClass="modalBackground" 
      DropShadow="True" 
      PopupDragHandleControlID="programmaticPopupDragHandle" 
      RepositionMode="RepositionOnWindowScroll" > 
     </asp:ModalPopupExtender> 
       <asp:Panel runat="server" CssClass="modalPopup" ID="programmaticPopup" style="display:none;width:350px;padding:10px"> 
       <asp:Panel runat="Server" ID="programmaticPopupDragHandle" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black;text-align:center;"> 
         Processing... Please Wait... 
       </asp:Panel> 
        <br /> 
        <div style="text-align:center;"><img src="images/loader.gif" /></div> 
       </asp:Panel> 
    <div class="page"> 
     <div class="header"> 
      <div class="title"> 
       <h1> 
        <asp:Label ID="lblTitle" runat="server" Text="Home"></asp:Label><br /> 
       </h1> 
      </div> 
      <div class="loginDisplay"> 
       <asp:Label ID="LoginStatus" runat="server" Text="Not logged in."></asp:Label> 
      </div> 
      <div class="clear hideSkiplink"> 
       <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" 
        EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> 
        <DynamicMenuItemStyle CssClass="dynamic" /> 
        <Items> 
         <asp:MenuItem NavigateUrl="~/Home.aspx" Text="Home"></asp:MenuItem> 
         <asp:MenuItem NavigateUrl="~/PrizeListing.aspx" Text="Prize Listing"> 
         </asp:MenuItem> 
         <asp:MenuItem Text="Administration" 
          Value="Administration" Selectable="False"> 
          <asp:MenuItem Text="Users" Value="Users" NavigateUrl="~/Admin.aspx?mode=users"></asp:MenuItem> 
          <asp:MenuItem Text="Prizes >" Value="Prizes" NavigateUrl="~/Admin.aspx?mode=prizes"> 
          <asp:MenuItem Text="Prizes GL Codes" Value="Prizes GL Codes" NavigateUrl="~/PrizesGLCodes.aspx"> 
          </asp:MenuItem> 
          </asp:MenuItem> 
          <asp:MenuItem Text="Tournaments >" Value="Tournaments" NavigateUrl="~/tournaments.aspx"> 
           <asp:MenuItem Text="Tournament Templates" Value="Tournament Templates" NavigateUrl="~/TournamentTemplates.aspx"> 
          </asp:MenuItem> 
          </asp:MenuItem> 
          <asp:MenuItem Text="Winners >" Value="Winners" NavigateUrl="~/Admin.aspx?mode=winners"> 
          <asp:MenuItem Text="Issue Bounty Prizes" NavigateUrl="~/IssueBountyPrizes.aspx"></asp:MenuItem> 
          <asp:MenuItem Text="Merged\Banned Players" Value="Merged\Banned Players" NavigateUrl="~/BannedAndHiddenPlayers.aspx"> 
          </asp:MenuItem> 
          </asp:MenuItem> 
          <asp:MenuItem Text="Inventory >" Value="Inventory" 
           NavigateUrl="~/Inventory.aspx"> 
          <asp:MenuItem Text="Reconciliation Notes" Value="Reconciliation Notes" 
           NavigateUrl="~/ReconciliationNotes.aspx"> 
          </asp:MenuItem> 
          </asp:MenuItem> 
          <asp:MenuItem NavigateUrl="~/ReceiveInventory.aspx" Text="Receive Inventory" 
           Value="Receive Inventory"></asp:MenuItem> 
         </asp:MenuItem> 
         <asp:MenuItem Text="Reports" 
          Value="Reports" Selectable="False"> 
          <asp:MenuItem NavigateUrl="~/ReportsAllPrizes.aspx" Text="All Prizes" 
           Value="All Prizes"></asp:MenuItem> 
          <asp:MenuItem NavigateUrl="~/ReportsPhysicalPrizes.aspx" 
           Text="Physical Prize Audit" Value="Physical Prize Audit"></asp:MenuItem> 
          <asp:MenuItem NavigateUrl="~/ReportsReconciliation.aspx" Text="Reconciliation" 
           Value="Reconciliation"></asp:MenuItem> 
           <asp:MenuItem NavigateUrl="~/ReportsExactTargetEmailHistory.aspx" Text="ExactTarget Email History" 
    Value="ExactTargetEmailHistory"></asp:MenuItem> 
         </asp:MenuItem> 
         <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/> 
        </Items> 
       </asp:Menu> 
      </div> 
     </div> 
     <div class="main"> 
      <asp:ContentPlaceHolder ID="MainContent" runat="server"/> 
     </div> 
     <div class="clear"> 
     </div> 
    </div> 
    <div class="footer"> 

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

你會發現，搜索按鈕會導致頁面調用window.load一個girdview.databind。但是，您會注意到，導出按鈕不會調用任何重新加載頁面的方式，因此不會觸發window.load事件，這是我隱藏彈出窗口以便永久保留的位置。

這是其中的一個頁面。

This is one of the the pages.

導出按鈕不會觸發window.load所以它不能隱藏模式彈出 the export button does not trigger window.load so it cannot hide the modal popup.

來源

2014-11-24 Christopher Peterson

你可以通過BeginRequestHandler和EndRequestHandler事件處理這個問題。我認爲你需要像下面這樣的東西，並刪除你其他方法（onload和onbeforeunload）。當頁面請求開始時顯示模式彈出窗口，當頁面請求結束時，隱藏模式彈出窗口。請參考我的其他回答here類似的問題像你的。

<script type="text/javascript"> 
    function pageLoad(sender, args) { 
     var prm = Sys.WebForms.PageRequestManager.getInstance(); 
     prm.add_beginRequest(BeginRequestHandler); 
     prm.add_endRequest(EndRequestHandler); 
    } 

    function BeginRequestHandler(sender, args) { 
     var modalPopupBehavior = $find('programmaticModalPopupBehavior'); 
     modalPopupBehavior.show(); 
    } 

    function EndRequestHandler(sender, args) { 
     var modalPopupBehavior = $find('programmaticModalPopupBehavior'); 
     modalPopupBehavior.hide(); 
    } 
</script>

來源

2014-11-24 20:14:22

pageload被激發，但是，prm.add_beginRequest（BeginRequestHandler）; prm.add_endRequest（EndRequestHandler）;沒有被解僱。任何想法有什麼不對？ – 2014-11-25 20:30:37

觸發回發的頁面上是否有任何控件（可能是按鈕）？嘗試使用'onclick'事件來添加一個'asp：button'，它應該帶你通過'BeginRequestHandler'和'EndRequestHandler'事件。 – 2014-11-25 21:44:01

理想情況下，我希望彈出窗口在頁面init中顯示aka可以顯示的最早位置，並在頁面加載完成後立即隱藏。另外，如果彈出窗口不受回發影響並在頁面加載完成後存活，那將會很好。 – 2014-11-25 21:58:59

頁面加載期間的模態彈出有時不隱藏：ASP.NET C＃Javascript jquery

回答

相關問題