JavaScript日期对象重置

Question

所以我有一点困难，找出一种方法让我的计时器在我的番茄钟计时器中每分钟重置为59秒。日期对象是否有一个内置的倒数计数方法？这里是我的代码：

'use strict'; 

//Visual representation of work/break times and counter 
let $workDisplay = $("#workNum"), 
    $breakDisplay = $("#breakNum"), 
    $workMinus = $(".workMinus"), 
    $workPlus = $(".workPlus"), 
    $breakMinus = $(".breakMinus"), 
    $breakPlus = $(".breakPlus"), 
    $counter = $("#counter"); 

//Initialize date object to work with functions (seven 0's to remove default local time) 
let time = new Date(0, 0, 0, 0, 0, 0, 0); 

let state = 'off'; 

//Set time dynamically 
let setTime = function(minutes, seconds) { 
    minutes = time.setMinutes(minutes); 
    seconds = time.setSeconds(seconds); 
    return { minutes: minutes, seconds: seconds } 
} 

//Default value for minutes and seconds (25) 
setTime(25 - 1, 59); 

let getMinutes = time.getMinutes(setTime.minutes); 
let getSeconds = time.getSeconds(setTime.seconds); 

$workDisplay.text(getMinutes); 
$counter.text(getMinutes); 

//Timer states 
let toggleTimer = function(newState) { 
    displayTime(); 

    if (state !== 'done') { 
     //The ? serves as a toggle (statement ? true value : false value) 
     state = newState || (state == 'on' ? 'off' : 'on'); 
    } 

    if (state == 'off') { 
     $counter.text(getMinutes + ":" + getSeconds); 
    } 
    console.log(state); 
} 

$counter.on('click',() => toggleTimer()); 

//Shrink these with an if statement later (check Dustin's DMs on Slack) 
$workMinus.on('click', function() { 
    getMinutes--; 
    console.clear(); 
    $workDisplay.text(getMinutes); 
    $counter.text(getMinutes); 
    console.log(getMinutes); 
}); 

$workPlus.on('click', function() { 
    getMinutes++; 
    console.clear(); 
    $workDisplay.text(getMinutes); 
    $counter.text(getMinutes); 
    console.log(getMinutes); 
}); 

//Count down seconds and minutes 
let countdownSecond = function() { 
    if (state == 'on') { 
     //Seconds stuff 
     getSeconds--; 
     $counter.text(getMinutes + ":" + getSeconds); 
    } 
} 

let countdownMinute = function() { 
    if (state == 'on') { 
     getMinutes--; 
     $counter.text(getMinutes + ":" + getSeconds); 
    } 
} 

//Update time display every minute/second 
function displayTime() { 
    window.setInterval(countdownSecond, 1000); 
    window.setInterval(countdownMinute, 60000) 
} 

console.log(state); 

目前，我的计时器下降到负面，而不是重新设置为59秒新的一分钟。事实上，它甚至从底片开始！任何提示，以帮助我的计时器正常运作，将不胜感激:)

Answer 1

如果你正在创建一个倒数计时器，只关心时间，使用日期和当前时间的日期，不要尝试使用日期本身为柜台。

所以，如果你想倒计时每天5分钟：

1. 创建的起始日期对象（这是你的时代）
2. 转换的时间间隔，以秒（300）
3. 呼叫的setTimeout约每秒（调整为实际经过的时间）
4. 定时器功能应该通过创建一个新的日期
5. 获取ELA获取当前时间psed时间作为消逝的时间或剩余时间
6. 停止时到达零或间隔（如果递增计数）

有很多倒计时定时器的历元和当前时间

格式之间的差异在这里，我确信你可以找到适合的人。

这里有一个显示算法：

var countDown = (function() { 
 
    var epoch, limitMs, element; 
 
    
 
    // Return seconds formatted as m:ss 
 
    function toMins(secs) { 
 
    return (secs/60|0) + ':' + ('0'+secs%60).slice(-2) 
 
    } 
 
    
 
    return function(secs, id) { 
 

 
    // If first call, set epoch and limit 
 
    if (!epoch) { 
 
\t epoch = new Date().getTime(); 
 
\t limitMs = secs * 1000; 
 
\t element = document.getElementById(id); 
 
\t } 
 
    
 
    // Get current time 
 
    var now = new Date(); 
 
    
 
    // Get difference in seconds 
 
    var diff = now - epoch; 
 
\t 
 
\t // Get time remaining in whole seconds 
 
\t var remainSecs = Math.round((limitMs - diff)/1000); 
 
\t 
 
\t // Set time to next call, as close to next whole second as possible 
 
\t var lag = 1000 - (diff%1000); 
 

 
\t // Set default display 
 
    var displayMins = '0:00'; 
 
    
 
    // If haven't reached the end, set the value to display and call again 
 
    if (diff < limitMs) { 
 
     displayMins = toMins(remainSecs); 
 
\t setTimeout(countDown, lag); 
 
    } 
 
    element.textContent = displayMins; 
 
    } 
 
}()); 
 

 

 
countDown(150,'minsDisplay');

<div id="minsDisplay"></div>