在按钮上显示倒数计时器

Posted

技术标签:

【中文标题】在按钮上显示倒数计时器【英文标题】:Showing countdown timer on a button 【发布时间】:2015-12-16 10:36:51 【问题描述】:

我找到了一个设置倒数计时器的代码,但它只在页面加载时显示分钟而不是秒,而且我希望当用户单击按钮时应该开始倒计时并且时间(例如 10:59)应该显示在单击的按钮。 以下是代码:

aspx 代码(ASP.net C#)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Reservation.aspx.cs" Inherits="Reservation" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    </head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:ScriptManager ID="ScriptManagerTimer" runat="server"></asp:ScriptManager>
         <asp:Timer ID="timer1" runat="server" Interval="1000" OnTick="timer1_tick"></asp:Timer>
       <asp:UpdatePanel id="updPnl" 
        runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <asp:Button ID="btnTimer" runat="server" BackColor="#05CC00" Height="35px" Text="Reserve" Width="89px" style="border-radius:8px" OnClick="btnTimer_Click"/>
            &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        </ContentTemplate>
        <Triggers>
        <asp:AsyncPostBackTrigger ControlID="timer1" EventName ="tick" />
       </Triggers>
     </asp:UpdatePanel>

    </div>

    </form>

</body>
</html>

aspx.cs 代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Reservation : System.Web.UI.Page

    protected void Page_Load(object sender, EventArgs e)
    

        if (!ScriptManagerTimer.IsInAsyncPostBack)
            Session["timeout"] = DateTime.Now.AddMinutes(10).ToString();
    

    protected void timer1_tick(object sender, EventArgs e)
    
        if (0 > DateTime.Compare(DateTime.Now,
       DateTime.Parse(Session["timeout"].ToString())))
        
            btnTimer.Text = ((Int32)DateTime.Parse(Session["timeout"].
            ToString()).Subtract(DateTime.Now).Minutes).ToString();
        
    

【问题讨论】:

基本上,您需要其他人修改您在其他地方找到的代码,以满足您的需要!!。你不认为你应该表现出更多的尊严吗?解决方案比花 15 分钟询问更容易。 所以基本上你不知道怎么做或者你不想帮我 哦!等等,我不需要你的帮助! 老实说,您需要帮助。这就是你问的原因。我提到的是,SO 不是问和得到什么。这不是程序商店。我们和你一样都是程序员。我们解决问题是为了帮助他人。由于我们正在花时间解决您的问题,因此我们也很感谢您。如果您没有花一些时间尝试修改代码以自己尝试,那么您如何期望其他人花时间解决您的问题?您正在将代码从其他地方复制到这里并询问解决方案。那不好。展示您尝试过的一些努力,哪些有效,哪些无效?。 【参考方案1】:
if (0 > DateTime.Compare(DateTime.Now,
   DateTime.Parse(Session["timeout"].ToString())))
    

        btnTimer.Text = ((Int32)DateTime.Parse(Session["timeout"].
        ToString()).Subtract(DateTime.Now).Minutes).ToString("HH:mm:ss");
    

TimeSpan.ToString() 提供多种字符串格式。更多信息:MSDN

:)

【讨论】:

以上是关于在按钮上显示倒数计时器的主要内容,如果未能解决你的问题,请参考以下文章

如何通过在倒数计时器中按住按钮来添加值

Python - 为倒数计时器创建一个取消按钮

如何在android的状态栏上显示倒数计时器,如时间显示?

Flutter:显示分钟和秒的倒数计时器

为啥倒数计时器突然执行得很快?

如何通过单击按钮启动倒数计时器事件?