AJAX-ASP.NET-计时器延迟问题

Question

I'm trying to make an webapplication where you see an Ajax countdown timer. 我正在尝试制作一个Web应用程序，在其中您可以看到一个Ajax倒数计时器。 Whenever I push a button the countdown should go back to 30 and keep counting down. 每当我按下按钮时，倒数应回到30并继续倒数。

Now the problem is whenever I push the button the timer keeps counting down for a second or 2 and most of the time after that the timer keeps standing on 30 for to long. 现在的问题是，每当我按下按钮时，计时器就会持续倒数一秒或2秒，并且在大多数情况下，计时器会一直保持30秒钟的时间。

WebForm code: WebForm代码：

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Label ID="Label1" runat="server" Text="geen verbinding"></asp:Label>
        <br />
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
        <br />
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
    </Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
</asp:Timer>

</form>

Code Behind: 背后的代码：

static int timer = 30;
protected void Page_Load(object sender, EventArgs e)
{
    Label1.Text = timer.ToString();
}
protected void Timer1_Tick(object sender, EventArgs e)
{
    timer--;

}
protected void Button1_Click(object sender, EventArgs e)
{
    timer = 30;         
}

Hope somebody knows what the problem is and if there is anyway to fix this. 希望有人知道问题出在哪里，以及是否有解决此问题的方法。

Thanks in advance! 提前致谢！

Answer 1

Why don't you implement the Timer entirely on the ClientSide? 为什么不完全在ClientSide上实现Timer？ Can you explain why it has to be a callback? 您能解释为什么它必须是回调吗？ What does it need to do on the Server? 它在服务器上需要做什么？

<script type="text/javascript" language="javascript">
var timer = 0;
function resetTimer() {
    timer = 0;
    timerTick();
}
function timerTick() {
    var target = document.getElementById("timerResult");

    target.innerHTML = timer++;
    window.setTimeout("timerTick()", 1000);
}
</script>

And in the body tag... 在身体标签里

<body onload="timerTick();">

And somewhere to display 在某个地方展示

<div id="timerResult" >timerResult</div>

You justy have to add a button chich calls resetTimer(). 您只需要添加一个按钮即可调用resetTimer（）。 I'll leave that to you 我留给你

AJAX-ASP.NET-计时器延迟问题

问题描述

1 个解决方案

解决方案1
1 已采纳 2010-04-23 08:15:15

AJAX-ASP.NET-计时器延迟问题

问题描述

1 个解决方案

解决方案1 1 已采纳 2010-04-23 08:15:15

解决方案1
1 已采纳 2010-04-23 08:15:15