ASP.NET页上的倒数计时器

时间:2020-03-06 14:29:26  来源:igfitidea点击:

我们能推荐我一种在ASP.NET页上放置计时器的方法吗?

现在,我使用以下代码:

Default.aspx

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
    <asp:Label ID="Label1" runat="server">60</asp:Label>
    <asp:Timer ID="Timer1" runat="server" Interval="1000" 
        ontick="Timer1_Tick">
    </asp:Timer>
</ContentTemplate>
</asp:UpdatePanel>

Default.aspx.cs

protected void Timer1_Tick(object sender, EventArgs e)
{
    int seconds = int.Parse(Label1.Text);
    if (seconds > 0)
        Label1.Text = (seconds - 1).ToString();
    else
        Timer1.Enabled = false;
}

但这是昂贵的交通。我更喜欢纯客户端方法。在ASP.NET中可以吗?

解决方案

我们可以在.aspx页中添加类似的内容

<form name="counter"><input type="text" size="8" 
name="d2"></form> 

<script> 
<!-- 
// 
 var milisec=0 
 var seconds=30 
 document.counter.d2.value='30' 

function display(){ 
 if (milisec<=0){ 
    milisec=9 
    seconds-=1 
 } 
 if (seconds<=-1){ 
    milisec=0 
    seconds+=1 
 } 
 else 
    milisec-=1 
    document.counter.d2.value=seconds+"."+milisec 
    setTimeout("display()",100) 
} 
display() 
--> 
</script>

在这里找到

好,最后我以

<span id="timerLabel" runat="server"></span>

<script type="text/javascript">

    function countdown() 
    {
        seconds = document.getElementById("timerLabel").innerHTML;
        if (seconds > 0) 
        {
            document.getElementById("timerLabel").innerHTML = seconds - 1;
            setTimeout("countdown()", 1000);
        }
    }

    setTimeout("countdown()", 1000);

</script>

真的很简单。就像旧的使用JavaScript的纯HTML一样。

使用此javascript代码----

var sec=0 ;
 var min=0;
var hour=0;
var t;

function display(){ 
 if (sec<=0){ 
    sec+=1;
 } 
if(sec==60)
{
sec=0;
min+=1;
}
if(min==60){
hour+=1;
min=0;
}

 if (min<=-1){ 
    sec=0; 
    min+=1;
 } 

 else 
    sec+=1 ;
document.getElementById("<%=TextBox1.ClientID%>").value=hour+":"+min+":"+sec;
    t=setTimeout("display()",1000);
    }
window.onload=display;