asp.net中的计时器和更新面板
我正在尝试在asp.net中创建计时器asp.net中的计时器和更新面板,asp.net,vb.net,timer,updatepanel,Asp.net,Vb.net,Timer,Updatepanel,我正在尝试在asp.net中创建计时器 Public Class _Default Inherits System.Web.UI.Page Dim min As Integer Dim sec As Integer Dim hr As Integer Dim totalTime As Integer Dim timerStr As String Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs
Public Class _Default
Inherits System.Web.UI.Page
Dim min As Integer
Dim sec As Integer
Dim hr As Integer
Dim totalTime As Integer
Dim timerStr As String
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
totalTime = 5340
hr = Math.Floor(totalTime / 3600)
min = 30
sec = totalTime Mod 60
timerStr = String.Format("{0:00}:{1:00}:{2:00}", hr, min, sec)
label1.Text = timerStr
End Sub
Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As EventArgs)
Display()
label1.Text = timerStr
End Sub
Protected Sub Display()
totalTime -= 1
hr = Math.Floor(totalTime / 3600)
sec = totalTime Mod 60
If sec = 0 Then
min = (totalTime / 60) Mod 60
End If
timerStr = String.Format("{0:00}:{1:00}:{2:00}", hr, min, sec)
End Sub
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
Display()
label1.Text = timerStr
End Sub
End Class
//更新面板代码
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">
</asp:Timer>
<asp:Button ID="Button1" runat="server" Text="Button" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"
RenderMode="Inline">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Label ID="label1" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
现在,根据代码计时器每秒调用一次,但它没有发生,我尝试使用相同的按钮并单击事件,但当我按下按钮时,文本仍然不是更新,而是页面刷新。我做错了什么吗?如果您正在为网页开发计时器,则必须在客户端使用JavaScript执行此操作,因为一旦服务器端代码运行并将页面呈现给浏览器,服务器端代码就会完成,不再参与页面生命周期 下面是一个客户端计时器的简化示例。它有一个标签(在浏览器中变为SPAN)和两个按钮-用于启动和停止计时器:
<span id="Label1" >Seconds: 0</span>
<button id="Button1" onclick="startResetTimer()">Start/Reset</button>
<button id="Button2" onclick="stopTimer()" disabled="disabled">Stop</button>
当您单击“启动/重置”按钮时,计时器通过功能启动。当您单击“停止”时,计时器将通过功能停止
你可以尝试一个工作演示,它只显示秒,但你应该得到的想法
var time;
var interval;
function startResetTimer() {
document.getElementById('Button1').disabled = "disabled";
document.getElementById('Button2').disabled = "";
time = 0;
interval = setInterval(function() {
time++;
document.getElementById('Label1').innerHTML = "Seconds: " + time
}, 1000)
}
function stopTimer() {
document.getElementById('Button1').disabled = "";
document.getElementById('Button2').disabled = "disabled";
clearInterval(interval)
}