0

我有一个网络表单，其中有一个 javascript 函数，用于评估它是否应该显示一个 div ......这是函数......

function viewCalendars()
            {
                if (document.getElementById('ddlDates').value == '5')
                {
                    document.getElementById('divSpecificDates').style.display = 'inline';
                }

                else
                {
                    document.getElementById('divSpecificDates').style.display = 'none';
                }

                return;
            }

我也将此添加到我的表单中

<body onload="viewCalendars();">
//Everything
</body>

因此，即使有回发，如果下拉列表选择了特定值，它也会显示 div。

但是，我最近添加了一个 updatepanel 和一个 updateprogress ......现在我认为这将不再起作用，因为不会发生回发。

这就是我现在所拥有的...

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Consumptions.aspx.cs" Inherits="Station.Consumptions" %>
<%@ Register TagPrefix="ew" Namespace="eWorld.UI" Assembly="eWorld.UI, Version=1.9.0.0, Culture=neutral, PublicKeyToken=24d65337282035f2" %>
<!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 id="Head1" runat="server">
        <title>
            Lista De Consumos
        </title>

        <link href="css/Style.css" type="text/css" rel="stylesheet"/>

        <style type="text/css">
            #blur
            {
                width: 100%;
                background-color: black;
                moz-opacity: 0.5;
                khtml-opacity: .5;
                opacity: .5;
                filter: alpha(opacity=50);
                z-index: 120;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
            }

            #progress
            {
                border: black 1px solid;
                padding: 5px;
                z-index: 100;                
                width: 250px;
                position: absolute;
                background-color: #fff;
                -moz-opacity: 0.75;
                font-family: Tahoma;
                font-size: 11px;
                font-weight: bold;
                text-align: center;
            }
        </style>

        <script type="text/javascript">
            function viewCalendars()
            {
                if (document.getElementById('ddlDates').value == '5')
                {
                    document.getElementById('divSpecificDates').style.display = 'inline';
                }

                else
                {
                    document.getElementById('divSpecificDates').style.display = 'none';
                }

                return;
            }
        </script>
    </head>

    <body onload="viewCalendars();">
        <form id="form1" runat="server">
            <asp:ScriptManager ID="sm" runat="server">
            </asp:ScriptManager>

            <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                <ProgressTemplate>
                    <div id="blur">
                    </div>
                    <div id="progress">
                        <asp:Image ID="imgLoading" GenerateEmptyAlternateText="true" runat="server" ImageUrl="~/images/loading.gif" />
                    </div>
                </ProgressTemplate>
            </asp:UpdateProgress>

            <asp:UpdatePanel ID="upd" runat="server">
                <ContentTemplate>
                    <asp:DropDownList ID="ddlDates" CssClass="tbox" runat="server">
                    </asp:DropDownList>

                    <div runat="server" id="divSpecificDates" style="display: none; width: 100%; z-index: 1000;">
                    </div>

                    &nbsp;
                    <asp:Button Text="Filtrar" CssClass="btn" runat="server" ID="btnFilter" onclick="btnFilter_Click" />
                </ContentTemplate>

                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnFilter" EventName="Click" />
                </Triggers>
            </asp:UpdatePanel>
        </form>
    </body>
</html>

所以，我注意到，当你点击 btnFilter 按钮后，它的功能会被触发，虽然 updateprogress 是可见的，但是在它消失后（并且 btnFilter 功能完成） divSpecificDates 在应该可见的时候不可见。我想我必须在一切完成后调用 viewCalendars() ......

我必须如何以及在哪里调用此功能？

更新：我刚刚摆脱了更新进度......它仍然无法正常工作，所以我想问题不存在......可能它在更新面板上

4

1 回答 1

3

当 UpdatePanel 更新时，DOM 发生了变化，您需要重新运行加载页面时所做的初始化。这是通过添加 UpdatePanel 时 asp.net 包含的 javascript 函数完成的。所以onload从身体上取下 并使用pageLoad.

所以从这一行删除onload

<body onload="viewCalendars();">

并添加此脚本

<script>
   function pageLoad() { 
      viewCalendars();
   }  
</script>

类似于如何在 UpdatePanel 部分回发后保留 javascript
参考：Ajax 客户端生命周期事件

于 2013-03-13T20:53:47.410 回答