倒计时定时器
等级: 初级
我们生活中都有许多期待的重要事件,如生日、周年纪念日和节假日等。如果有一款应用程序可以倒数到某个事件发生的时间,那该多好啊!倒计时定时器就是这样一个应用!
倒计时定时器的目标是提供一个不断递减的显示,显示从用户输入的事件开始起剩余的月份数、天数、小时数、分钟数和秒数。
限制
- 使用内置的语言函数进行计算,而不是依赖于像MomentJS这样的库或包。当然,这假设您选择的语言有足够的日期和时间操作函数。
- 您不得使用任何代码生成器,例如Counting Down To网站。您应该开发自己的原创实现。
用户故事
- [ ] 用户可以看到一个包含事件名称字段、日期字段、可选时间和'开始'按钮的事件输入框。
- [ ] 用户可以通过输入事件名称、预定发生的日期和一个可选的时间来定义事件。如果时间被省略,它将被假定为在本地时间区中事件日期的午夜。
- [ ] 如果事件名称为空,用户会看到一条警告消息。
- [ ] 如果事件日期或时间输入错误,用户会看到一条警告消息。
- [ ] 如果倒计时定时器显示的剩余时间超过了事件的精度,用户会看到一条警告消息。
- [ ] 用户可以点击'开始'按钮,查看倒计时定时器开始显示从事件发生还剩多少天、小时、分钟和秒。
- [ ] 用户可以看到倒计时定时器中的元素自动递减。例如,当剩余秒数计数到达0时,剩余分钟数会减少1,然后秒数将从59开始倒计时。这个过程必须从秒数一直持续到倒计时显示中剩余的天数位置。
额外功能
- [ ] 用户可以保存事件,以便在不同会话中保持同步
- [ ] 当事件到达时,用户可以看到一个警报
- [ ] 用户可以指定多个事件。
- [ ] 用户可以看到每个已定义事件的倒计时定时器。
有用链接和资源
- 可以在这里找到基于模拟管倒计时定时器的图片 这里
clearInterval
MDNsetInterval
MDN- Date MDN