番茄钟计时器：变量值为'NaN'

我正在尝试构建一个类似http://codepen.io/GeoffStorbeck/full/RPbGxZ/的番茄钟。秒的值随机地到达NaN，然后在开始'break'后恢复正常。番茄钟计时器：变量值为'NaN'

$('#circle a').click(function() { 
    var timer = $('.time > span').html(); 
    timer = timer.split(':'); 
    var minutes = timer[0]; //Value of minutes 
    var seconds = timer[1]; //Value of seconds 

    var settimer = setInterval(function() { 
    seconds -= 1; 
    console.log(seconds); 
    if (seconds < 0 && minutes != 0) { 
     minutes -= 1; 
     minutes = String(minutes); 
     seconds = 59; 
    } else if (seconds < 10 && seconds.length != 2) 
     seconds = '0' + seconds; 
    if (minutes < 10 && minutes.length < 2) 
     minutes = '0' + minutes; 

    $('.time > span').html(minutes + ':' + seconds); 

    //Start break when session is completed 
    if (minutes == 0 && seconds == 0) { 
     $('.upper').find('h1').text('BREAK'); 
     var time = $('#break').find('span').text(); 
     $('.time > span').html('0' + time + ':00'); 
     $('#circle a').trigger("click"); //Start timer for break 
    } 
    }, 1000); 
});

这里的链接到codepen http://codepen.io/ibrahimjarif/pen/wMKJWN

如何解决NaN的问题？有没有更好的方法来实现这个？

来源

2015-12-17 Ibrahim

一些提示：不要使用'parseInt'没有第二个参数（'10'）。使用'.toString（）'而不是'String（'...'）'。使用数字_whole_time：'var minutes = Number（timer [0]），seconds = Number（timer [1]）;'，只能追加前导'0'或转换为字符串_ .html'功能。 – Xufox

@Xufox感谢您的输入。修复了代码。 – Ibrahim

@Xufox我应该删除问题，因为我解决了这个问题？我是新手。所以请建议。 – Ibrahim

代码$('#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); 
});

来源

2015-12-18 12:28:38 Ibrahim

番茄钟计时器：变量值为'NaN'

回答

相关问题