从代码隐藏设置一个 asp:HiddenField 值并在 javascript 函数中访问

Question

我正在尝试为 asp:Timer 设置一个倒计时计时器，它会在完成后刷新页面。我正在做的是在初始化时设置计时器间隔和隐藏值，然后调用 javascript 函数，该函数使用隐藏字段的信息启动倒计时计时器。

设置了间隔，设置了隐藏字段值，但是在尝试了各种方法之后，我得到的结果是 javascript 运行时隐藏字段值未初始化的问题。当我尝试在文档加载时直接调用该函数时，它也未初始化。

这是我目前使用的代码。

代码隐藏

DateTime refreshTime;
protected void refreshHidden_Init(object sender, EventArgs e)
{
    refreshTime = DateTime.Now.AddSeconds(60);
    refreshHidden.Value = refreshTime.ToString();
    int timeToFresh = (int)(refreshTime - DateTime.Now).TotalMilliseconds;
    refreshTimer.Interval = timeToFresh;
    refreshTimerJS();
}

protected void refreshTimerJS()
{
    StringBuilder script = new StringBuilder();
    script.Append("<script type=\"text/javascript\">");
    script.Append("var dt='");
    script.Append(refreshTime.ToString());
    script.Append("';");
    script.Append("</script>");
    Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "DateVars", script.ToString());
}

页面

<div id="autopriseUpdate" class="content">
    <asp:Timer runat="server" ID="refreshTimer" Interval="600000" OnTick="refreshTimer_Tick"></asp:Timer>
    <asp:Label runat="server" ID="refreshLabel" Text="1m 0s"></asp:Label>
    <asp:HiddenField runat="server" ID="refreshHidden" OnInit="refreshHidden_Init"/>
</div>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/refresh.js"></script>

javascript

$(document).ready(function () {
    refreshJS();
});

function refreshJS(){
    var dt = new Date($('#refreshHidden').value);
    $('#refreshLabel').countdown(dt).on('update.countdown', function (event)
    {
        $(this).html(event.strftime('%M:%S'));
    });
}

隐藏字段值已设置，asp:Timer 间隔倒计时并在点上刷新，但倒计时计时器未启动。我最好的猜测是我需要按照事情发生的顺序修复一些东西，但我没有任何线索。

我不能只对倒计时值进行硬编码，因为我要创建 refreshTime 变量，因此用户可以选择页面刷新之间的间隔时间。

如果有人知道如何让我的 javascript 工作或如何从代码隐藏中以其他方式获取 DateTime 值并加以利用，我将非常感谢您的帮助！

Answer 1

没有！

您的 JavaScript 无法使用以下方法访问该值：

var dt = new Date($('#refreshHidden').value);

它在 ASP.Net 世界中被称为 refreshHidden，但当页面呈现时，它会有一个不同的名称。

您的代码应该如下所示：

var hiddenField = $("#<%= refreshHidden.ClientID %>").val();
var dt = new Date(hiddenField);

Answer 2

作为迈克回答的替代方案，您还可以将 ClientIDMode 设置为静态，您的 jQuery 将按原样工作。（假设您使用的是 .NET 4.0 或更高版本）

<asp:HiddenField runat="server" ClientIDMode="Static" ID="refreshHidden" OnInit="refreshHidden_Init"/>

从代码隐藏设置一个 asp:HiddenField 值并在 javascript 函数中访问

Set an asp:HiddenField value from codebehind and access in javascript function

javascript

c#

asp.net

jquery

timer