倒计时脚本,不;t正确显示或倒计时
CountDown Script, Doesn't display or countdown correctly
所以我一直在努力调试pomodoro(番茄)时钟的脚本。我想要这个脚本做的是它将接收输入(在几分钟内)。现在,我的脚本正在倒数5秒,而不是1秒。此外,它也不会像我想要的那样显示分钟数。
我以一种合乎逻辑的方式编写了这个脚本,以登录到控制台并测试它。我在控制台中看到的是它每秒显示一次,但如果有意义的话,它每秒显示5秒。这是jsbin:https://jsbin.com/gigohajawo/3/edit?js骗局solehttps://jsbin.com/gigohajawo/3/edit?js,控制台
这是代码,任何帮助都将不胜感激!!!
//makes sure the page is loaded first
$(document).ready(function() {
//global variables
//grabs text of an id and converts it to an int
var countMin = 5;
var count1 = 60;
//when button id "but" is clicked...
//while page is up, it keeps track each second that has passed
for(; countMin >=0;countMin--){
var counter1 = setInterval(function(){
//calls timer function to count down
count1 = Timer(count1,counter1,countMin);
},1000);
count1 =60;
}
//counts down
function Timer(count,counter,minutes){
count--;
//once it hits 0 seconds, the interval will stop counting
if(count <=0){
clearInterval(counter);
return count;
}
//displays the countdown
if(minutes < 10){
if(count < 10){
console.log("0:0" + count);
} else {
console.log("0:" + count);
}
}else if(minutes > 0 && minutes < 10){
if(count < 10){
console.log("0" + minutes +":0" + count);
} else {
console.log("0"+minutes+":" + count);
}
} else{
if(count < 10){
console.log(minutes+":0" + count);
} else {
console.log=minutes+":" + count;
}
}
return count;
}
});
这个JSBin似乎达到了您的目的。
代码:
//makes sure the page is loaded first
$(document).ready(function() {
//global variables
//grabs text of an id and converts it to an int
var count1 = 120;
// Call a function every 1000 milliseconds (1 second)
var counter1 = setInterval(function() {
count1 = Timer(count1, counter1);
}, 1000);
//counts down
function Timer(count,counter){
// Decrement the seconds counter
count--;
// Get the minutes and seconds in whole numbers
var minutes = Math.floor(count / 60);
var seconds = count % 60;
// Once it hits 0 seconds, the interval will stop counting
if(count <=0){
clearInterval(counter);
}
// Pads the seconds with a 0
if (seconds < 10) {
seconds = "0" + seconds;
}
// Pads the minutes with a 0
if (minutes < 10) {
minutes = "0" + minutes;
}
//displays the countdown
console.log(minutes + ":" + seconds)
return count;
}
});
请注意:
- 由于已将
count1
定义为全局变量,因此不需要将其传递到Timer
counter1
也是如此
如果我重写它,我会做这样的事情:
//makes sure the page is loaded first
$(document).ready(function() {
var timeInSeconds = 120;
var timeCounter = setInterval(function() {
timeInSeconds--;
// If we hit 0 seconds clear the timer
if (timeInSeconds <= 0) {
clearInterval(timeCounter);
}
// Display the current time
displayTime();
}, 1000);
function displayTime(){
// Get the minutes and seconds in whole numbers
var minutes = Math.floor(timeInSeconds / 60);
var seconds = timeInSeconds % 60;
// Pad with zeros using the Ternary operator
seconds = (seconds < 10) ? "0" + seconds : seconds;
minutes = (minutes < 10) ? "0" + minutes : minutes;
// Display the countdown
console.log(minutes + ":" + seconds)
}
});
相关文章:
- 显示具有服务器端自动时间注销的同步倒计时计时器
- 我的时间倒计时脚本在谷歌浏览器中工作正常,但在其他浏览器中打开时它显示为南楠
- JavaScript倒计时计时器不会显示两次
- 单击按钮后显示倒计时
- 如何获得只显示小时的倒计时
- javascript在倒计时中显示秒数
- 倒计时计时器在Chrome和Firefox上显示不同的剩余时间
- 如果 cookie 存在,则显示倒计时 5 分钟
- Javascript 倒计时时间无法显示
- Java 脚本倒计时时钟不会显示
- jQuery 倒计时插件 - 仅显示非零周期
- jQuery Countdown 已安装.显示多个倒计时时遇到问题
- 倒计时结束时显示另一面
- 停止倒计时并每天显示消息
- jquery显示超时倒计时输出
- Javascript、倒计时定时器和显示文本
- 如何在php中显示多个倒计时计时器
- 日期时间倒计时,删除小数,并在每个类别中保留时间显示时间
- Jquery倒计时显示NaN在Safari,在Chrome / Firefox工作良好
- 当ajax计时器(倒计时)显示0时,调用c#函数