我正在尝试制作像http://codepen.io/GeoffStorbeck/full/RPbGxZ/这样的番茄钟。秒值随机变为NaN,然后在开始'break'后恢复正常。
VirtualHost configuration:
*:80 is a NameVirtualHost
default server localhost (/etc/apache2/sites-enabled/000-default.conf:1)
port 80 namevhost localhost (/etc/apache2/sites-enabled/000-default.conf:1)
port 80 namevhost atarica.com.br (/etc/apache2/sites-enabled/atarica.com.br.conf:1)
alias www.atarica.com.br
port 80 namevhost wiki.atarica.com.br (/etc/apache2/sites-enabled/atarica.com.br.conf:13)
port 80 namevhost atarica.com.br (/etc/apache2/sites-enabled/fabrincantes.com.conf:1)
alias www.fabrincantes.com
port 80 namevhost yellowtown.org (/etc/apache2/sites-enabled/yellowtown.org.conf:1)
alias www.yellowtown.org
port 80 namevhost wiki.yellowtown.org (/etc/apache2/sites-enabled/yellowtown.org.conf:35)
ServerRoot: "/etc/apache2"
Main DocumentRoot: "/var/www"
Main ErrorLog: "/var/log/apache2/error.log"
Mutex default: dir="/var/lock/apache2" mechanism=fcntl
Mutex mpm-accept: using_defaults
Mutex watchdog-callback: using_defaults
PidFile: "/var/run/apache2/apache2.pid"
Define: DUMP_VHOSTS
Define: DUMP_RUN_CFG
User: name="www-data" id=33 not_used
Group: name="www-data" id=33 not_used
这是codepen的链接 http://codepen.io/ibrahimjarif/pen/wMKJWN
如何解决NaN问题? 有没有更好的方法来实现这个?
答案 0 :(得分:1)
代码$('#circle a').trigger("click"); //Start timer for break
以递归方式调用最初执行的函数。此调用启动新计时器,而原始计时器正在进行中。
当新计时器执行时,原始计时器的seconds
值转到NaN
。由于有两个定时器,second
有两个值。原始计时器中seconds
的值导致NaN
无法解释的外观。
注意:两个计时器一直在同时运行。
最简单的解决方法是在开始新计时器之前停止当前计时器。
这是更新后的代码
$('#circle a').click(function() {
var timer = $('.time > span').html().split(':');;
var minutes = Number(timer[0]),
seconds = Number(timer[1]);
var settimer = setInterval(function() {
seconds -= 1;
if (seconds < 0 && minutes != 0) {
minutes -= 1;
seconds = 59;
} else if (seconds < 10 && seconds.length != 2)
seconds = '0' + seconds;
if (minutes < 10 && minutes.toString().length < 2)
minutes = '0' + minutes;
$('.time > span').html(minutes + ':' + seconds);
if (minutes == 0 && seconds == 0) {
clearInterval(settimer); //Stop the current timer
var upper_text = $('.upper').find('h1');
var time;
if (upper_text.text() == 'BREAK') {
upper_text.text('Session');
time = $('#session').find('span').text();
} else {
upper_text.text('BREAK');
time = $('#break').find('span').text();
}
$('.time > span').html(time + ':00');
$('#circle a').trigger("click"); //Start new timer
}
}, 1000);
});