函子蛋糕 2022-01-30 14:43 采纳率: 80.6%
浏览 27
已结题

如何用原生js写一个能够加减时间的计时器?

案例:我想休息45分钟,希望到点了被网页弹窗提醒。也就是说,我能够输入起始时间,例如8:45:00,然后开始计时,它能够自动在9:30:00提示弹窗。

我认为难点在于,时钟是60分钟进一次位,和十进制不同。卡在这里不会写了。

目标:据说有把时间先转换为毫秒再转回去的方法,可以考虑用这种方法写。也希望能看到更简便的方法。需要具体代码,我非常笨。先感谢了。

  • 写回答

2条回答 默认 最新

  • ZionHH 2022-01-31 13:27
    关注
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    </head>
    <body>
      <script>
        let timer = null
        function timeFunc() {
              const date = new Date()
              const hours = date.getHours()
              const mins = date.getMinutes()
              const now = date.getTime()
              // 时间(毫秒)
              const start = new Date().setHours(12, 30, 0) // 开始时间 12:30:00
              const end = new Date().setHours(13, 0, 0) // 结束时间 13:00:00
              const ms = end - start // 休息时间
              /**
               * 现在到开始休息的剩余时间
               * 大于当前时间 时间未到,减去当前时间即可
               * 小于当前时间 时间已过,+24小时减去当前时间
               */
              let remTime = start > now ? (start - now) : (start + 86400000 - now)
    
              timer = setTimeout(timeFunc, remTime)
              // 开始休息时间
              if (hours === 12 && mins === 30) {
                console.log('开始休息!')
                setTimeout(() => {
                  console.log('休息结束!')
                }, ms)
              }
        }
        timeFunc()
      </script>
    </body>
    </html>
    

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 2月19日
  • 已采纳回答 2月11日
  • 创建了问题 1月30日

悬赏问题

  • ¥100 求购一套带接口实现实习自动签到打卡
  • ¥50 MacOS 使用虚拟机安装k8s
  • ¥500 亚马逊 COOKIE我如何才能实现 登录一个亚马逊账户 下发新 COOKIE ..我使用下发新COOKIE 导入ADS 指纹浏览器登录,我把账户密码 修改过后,原来下发新COOKIE 不会失效的方式
  • ¥20 玩游戏gpu和cpu利用率特别低,玩游戏卡顿
  • ¥25 oracle中的正则匹配
  • ¥15 关于#vscode#的问题:把软件卸载不会再出现蓝屏
  • ¥15 vimplus出现的错误
  • ¥15 usb无线网卡转typec口
  • ¥30 怎么使用AVL fire ESE软件自带的优化模式来优化设计Soot和NOx?
  • ¥15 Ubuntu20.04.4.LTS系统如何下载安装VirtualBox虚拟机?