在 Typescript 中创建警报但警报不起作用的问题
Problem in creating an alarm in Typescript but the alarm isn't working
我正在使用打字稿创建一个闹钟,但遇到了问题。当时间过去时,我不会感到惊慌。
我从 HTML 页面获取了三个输入——小时、分钟 和秒。
之后我加上它们并减去当前时间。
let h = <HTMLInputElement>document.getElementById("h");//getting input values of hour and ...
let m = <HTMLInputElement>document.getElementById("m");
let s = <HTMLInputElement>document.getElementById("s");
let h1 = parseFloat(h.value);//converting the input values from string to float
let m1 = parseFloat(m.value);
let s1 = parseFloat(s.value);
var rHours = new Date().getHours();
var rMinutes = new Date().getMinutes();
var rSeconds = new Date().getMinutes();
var calc = (h1) + (m1) + (s1) - rHours - rMinutes - rSeconds;
if(calc<=0){
alert("Alarm");
}
}
但是不能正常使用。
我已经有一段时间没有制作倒数计时器了,所以我想我ddo 只是为了好玩。这不是特别的 Typescript,但它在编译器中确实 运行 很好(参见下面的 link)。它是常规 JS,因此它也会在代码段中显示 运行。我认为它可能会帮助您了解倒数计时器的工作原理。您的代码没有反映任何类型的倒计时,并且您确定经过时间的方法不正确。
为了演示的目的,我将 h1
、m1
和 s1
设置为动态地从片段为 运行 时起 1 分钟。您可以轻松地调整它以根据您的输入元素工作。
document.querySelector('p span').innerHTML = new Date().toString()
function startCountdown() {
/* In your code uncomment this section...
let el_h = <HTMLInputElement>document.getElementById("h");
let el_m = <HTMLInputElement>document.getElementById("m");
let el_s = <HTMLInputElement>document.getElementById("s");
*/
// in your code comment out these lines and use yours from above instead (for typescript typing)
let el_h = document.getElementById("h");
let el_m = document.getElementById("m");
let el_s = document.getElementById("s");
let h1 = parseFloat(el_h.value);
let m1 = parseFloat(el_m.value);
let s1 = parseFloat(el_s.value);
//const [h1, m1, s1] = ( (new Date().getHours() ) + ":" + (new Date().getMinutes() + 2) + ":" + new Date().getSeconds()).split(":");
// get todays date
let today = new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate();
// add on the hours from the inputs
today += " " + h1 + ":" + m1 + ":" + s1;
const myTime = new Date(today);
console.log('countdown to:', myTime, 'from:', new Date());
const interval = setInterval(() => {
let diff = (myTime.getTime() - new Date().getTime()) / 1000; // seconds
let h = Math.floor(diff / 3600);
let m = Math.floor(diff / 60 % 60);
let s = Math.floor(diff % 60)
console.log(h + " hours, " + m + " minutes, " + s + " seconds")
if (diff <= 0) {
clearInterval(interval);
console.log("ALARM");
}
}, 1000)
}
<p>Cur time: <span></span></p>
<input id='h' placeholder='Hour (military time)'><input id='m' placeholder='Minute'><input id='s' placeholder='Seconds'><button onclick='startCountdown()'>Start</button>
document.querySelector('p span').innerHTML = new Date().toString()
function startCountdown() {
/* In your code uncomment this section...
let el_h = <HTMLInputElement>document.getElementById("h");
let el_m = <HTMLInputElement>document.getElementById("m");
let el_s = <HTMLInputElement>document.getElementById("s");
*/
// in your code comment out these lines and use yours from above instead (for typescript typing)
let el_h = document.getElementById("h");
let el_m = document.getElementById("m");
let el_s = document.getElementById("s");
let h1 = parseFloat(el_h.value);
let m1 = parseFloat(el_m.value);
let s1 = parseFloat(el_s.value);
//const [h1, m1, s1] = ( (new Date().getHours() ) + ":" + (new Date().getMinutes() + 2) + ":" + new Date().getSeconds()).split(":");
// get todays date
let today = new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate();
// add on the hours from the inputs
today += " " + h1 + ":" + m1 + ":" + s1;
const myTime = new Date(today);
console.log('countdown to:', myTime, 'from:', new Date());
const interval = setInterval(() => {
let diff = (myTime.getTime() - new Date().getTime()) / 1000; // seconds
let h = Math.floor(diff / 3600);
let m = Math.floor(diff / 60 % 60);
let s = Math.floor(diff % 60)
console.log(h + " hours, " + m + " minutes, " + s + " seconds")
if (diff <= 0) {
clearInterval(interval);
console.log("ALARM");
}
}, 1000)
}
<p>Cur time: <span></span></p>
<input id='h' placeholder='Hour (military time)'><input id='m' placeholder='Minute'><input id='s' placeholder='Seconds'><button onclick='startCountdown()'>Start</button>
我正在使用打字稿创建一个闹钟,但遇到了问题。当时间过去时,我不会感到惊慌。 我从 HTML 页面获取了三个输入——小时、分钟 和秒。
之后我加上它们并减去当前时间。
let h = <HTMLInputElement>document.getElementById("h");//getting input values of hour and ...
let m = <HTMLInputElement>document.getElementById("m");
let s = <HTMLInputElement>document.getElementById("s");
let h1 = parseFloat(h.value);//converting the input values from string to float
let m1 = parseFloat(m.value);
let s1 = parseFloat(s.value);
var rHours = new Date().getHours();
var rMinutes = new Date().getMinutes();
var rSeconds = new Date().getMinutes();
var calc = (h1) + (m1) + (s1) - rHours - rMinutes - rSeconds;
if(calc<=0){
alert("Alarm");
}
}
但是不能正常使用。
我已经有一段时间没有制作倒数计时器了,所以我想我ddo 只是为了好玩。这不是特别的 Typescript,但它在编译器中确实 运行 很好(参见下面的 link)。它是常规 JS,因此它也会在代码段中显示 运行。我认为它可能会帮助您了解倒数计时器的工作原理。您的代码没有反映任何类型的倒计时,并且您确定经过时间的方法不正确。
为了演示的目的,我将 h1
、m1
和 s1
设置为动态地从片段为 运行 时起 1 分钟。您可以轻松地调整它以根据您的输入元素工作。
document.querySelector('p span').innerHTML = new Date().toString()
function startCountdown() {
/* In your code uncomment this section...
let el_h = <HTMLInputElement>document.getElementById("h");
let el_m = <HTMLInputElement>document.getElementById("m");
let el_s = <HTMLInputElement>document.getElementById("s");
*/
// in your code comment out these lines and use yours from above instead (for typescript typing)
let el_h = document.getElementById("h");
let el_m = document.getElementById("m");
let el_s = document.getElementById("s");
let h1 = parseFloat(el_h.value);
let m1 = parseFloat(el_m.value);
let s1 = parseFloat(el_s.value);
//const [h1, m1, s1] = ( (new Date().getHours() ) + ":" + (new Date().getMinutes() + 2) + ":" + new Date().getSeconds()).split(":");
// get todays date
let today = new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate();
// add on the hours from the inputs
today += " " + h1 + ":" + m1 + ":" + s1;
const myTime = new Date(today);
console.log('countdown to:', myTime, 'from:', new Date());
const interval = setInterval(() => {
let diff = (myTime.getTime() - new Date().getTime()) / 1000; // seconds
let h = Math.floor(diff / 3600);
let m = Math.floor(diff / 60 % 60);
let s = Math.floor(diff % 60)
console.log(h + " hours, " + m + " minutes, " + s + " seconds")
if (diff <= 0) {
clearInterval(interval);
console.log("ALARM");
}
}, 1000)
}
<p>Cur time: <span></span></p>
<input id='h' placeholder='Hour (military time)'><input id='m' placeholder='Minute'><input id='s' placeholder='Seconds'><button onclick='startCountdown()'>Start</button>
document.querySelector('p span').innerHTML = new Date().toString()
function startCountdown() {
/* In your code uncomment this section...
let el_h = <HTMLInputElement>document.getElementById("h");
let el_m = <HTMLInputElement>document.getElementById("m");
let el_s = <HTMLInputElement>document.getElementById("s");
*/
// in your code comment out these lines and use yours from above instead (for typescript typing)
let el_h = document.getElementById("h");
let el_m = document.getElementById("m");
let el_s = document.getElementById("s");
let h1 = parseFloat(el_h.value);
let m1 = parseFloat(el_m.value);
let s1 = parseFloat(el_s.value);
//const [h1, m1, s1] = ( (new Date().getHours() ) + ":" + (new Date().getMinutes() + 2) + ":" + new Date().getSeconds()).split(":");
// get todays date
let today = new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate();
// add on the hours from the inputs
today += " " + h1 + ":" + m1 + ":" + s1;
const myTime = new Date(today);
console.log('countdown to:', myTime, 'from:', new Date());
const interval = setInterval(() => {
let diff = (myTime.getTime() - new Date().getTime()) / 1000; // seconds
let h = Math.floor(diff / 3600);
let m = Math.floor(diff / 60 % 60);
let s = Math.floor(diff % 60)
console.log(h + " hours, " + m + " minutes, " + s + " seconds")
if (diff <= 0) {
clearInterval(interval);
console.log("ALARM");
}
}, 1000)
}
<p>Cur time: <span></span></p>
<input id='h' placeholder='Hour (military time)'><input id='m' placeholder='Minute'><input id='s' placeholder='Seconds'><button onclick='startCountdown()'>Start</button>