制作带日期时间的闹钟

Question

我正在尝试制作一个闹钟,它会在完成时发出声音.因此,例如,我设置警报应该开始的时间18:00:00和当前时间17:59:00,所以基本上警报应该在1分钟内启动.

我尝试这样做:

var x = '18:00:00';
var t = new Date(x) - new Date();
setTimeout(function(){ alert("Hello"); }, t);

这不起作用,不知道为什么.错误是NaN.

Answer 1

您的问题x是定义的方式.代码背后的逻辑是可靠的,但是你需要使用一些合理的智能日期时间操作来实现这一点.例如,让我们将闹钟设置为从加载页面起五秒钟:

x = new Date();
x.setSeconds(x.getSeconds() + 5);
var t = new Date(x) - new Date();
setTimeout(function(){ alert("Hello"); }, t);

我建议您查看Date并找出解决问题所需的逻辑和方法.

粗略的解决方案

仅基于小时数的警报逻辑应如下所示:

• 使用当前日期,月份等,从HH:mm:ss的闹钟时间创建一个虚拟日期.
• 比较a new Date()以查看它是在当前日期之前还是之后.
• 如果在当前日期之前,那么设置x为明天和HH:mm:ss给你.
• 否则设置为今天和HH:mm:ss.
• 减去日期并处理警报.

以下代码演示了如何实现此目的:

var x = {
  hours: 18,
  minutes: 0,
  seconds: 0
};

var dtAlarm = new Date();
dtAlarm.setHours(x.hours);
dtAlarm.setMinutes(x.minutes);
dtAlarm.setSeconds(x.seconds);
var dtNow = new Date();

if (dtAlarm - dtNow > 0) {
  console.log('Later today, no changes needed!');
}
else {
  console.log('Tomorrow, changing date to tomorrow');
  dtAlarm.setDate(dtAlarm.getDate() + 1);
}

var diff = dtAlarm - new Date();
setTimeout(function(){ alert("Hello"); }, diff);

笔记:

• HH:mm:ss是指小时:分:秒格式(详见此处).
• 我也使用一个对象来代替你x,使转换更容易.您可以从字符串轻松构建对象.