2017-08-24 117 views
0

我正在使用以下腳本計算計時器。它在幾秒鐘內計數沒有問題,但我無法使其顯示分鐘。例如1:35(1分35秒) 任何建議,將不勝感激。提前致謝。分鐘計時器上不顯示分鐘

var clicked = false; 
 
var sec = 00; 
 
var min = 00; 
 

 
function startClock() { 
 
    if (clicked === false) { 
 
    clock = setInterval("stopWatch()", 1000); 
 
    clicked = true; 
 
    } else if (clicked === true) {} 
 
} 
 

 
function stopWatch() { 
 
    sec++; 
 
    document.getElementById("timer").innerHTML = sec; 
 
} 
 

 
function stopClock() { 
 
    window.clearInterval(clock); 
 
    sec = 0; 
 
    document.getElementById("timer").innerHTML = 0; 
 
    clicked = false; 
 
} 
 

 
var min = 0; 
 
var second = 00; 
 
var zeroPlaceholder = 0; 
 
var counterId = setInterval(function() { 
 
    countUp(); 
 
}, 1000); 
 

 
function countUp() { 
 
    second++; 
 
    if (second == 59) { 
 
    second = 00; 
 
    min = min + 1; 
 
    } 
 
    if (second == 10) { 
 
    zeroPlaceholder = ''; 
 
    } else 
 
    if (second == 00) { 
 
    zeroPlaceholder = 0; 
 
    } 
 

 
    document.getElementById("count-up").innerText = min + ':' + zeroPlaceholder + second; 
 
}
<div class="timer"> 
 
    <div id="timer">0:00</div> 
 
    
 
    <input type="button" id="btnParentButton" value="start timer" onClick="startClock()"/>

+0

前導零不包含在數字中,你需要字符串來代表最新的數字與前導零。一個流行的技巧,如果需要添加前導零:'var minStr =('0'+ min).substr(-2);'。 – Teemu

+0

爲什麼你有兩個變量'sec'和'second'?你也是var'ing'min'兩次。 – AndFisher

回答

0

希望這可以幫助你。

更好的方法是讓你分鐘,秒爲全局變量和簡單的功能,每個按鈕

編輯

更新使用純代碼JS

var min = 0; 
 
var sec = 0; 
 
var timer = undefined; 
 
var isStarted = false; 
 

 
function startcount(){ 
 
    sec++; 
 
    if(sec==60) 
 
    { 
 
    sec=0; 
 
    min++; 
 
    } 
 
    updateClock(); 
 
} 
 

 
function updateClock(){ 
 
    var displaySec = sec < 10 ? "0" + sec : sec; 
 
    var displayMin = min < 10 ? "0" + min : min; 
 
    document.getElementById("count").innerHTML = displayMin + " : " + displaySec; 
 
} 
 

 
function start(){ 
 
    if(timer == undefined || !isStarted){ 
 
    timer = setInterval(function(){ 
 
    startcount(); 
 
    },1000); 
 
    } 
 
    isStarted = true; 
 
} 
 

 
function stop(){ 
 
    isStarted = false; 
 
    clearInterval(timer); 
 
} 
 

 
function reset(){ 
 
    stop(); 
 
    min=sec=0; 
 
    timer = undefined; 
 
    updateClock(); 
 
} 
 

 

 
updateClock();
<div id="count"></div> 
 
<button class="start" onClick="start()">Start</button> 
 
<button class="stop" onClick="stop()">Stop</button> 
 
<button class="reset" onClick="reset()">Reset</button>

0

看跌向上計數,而不是ID =定時器

var clicked = false; 
 
var sec = 00; 
 
var min = 00; 
 

 
function startClock() { 
 
    if (clicked === false) { 
 
    clock = setInterval("stopWatch()", 1000); 
 
    clicked = true; 
 
    } else if (clicked === true) {} 
 
} 
 

 
function stopWatch() { 
 
    sec++; 
 
    document.getElementById("timer").innerHTML = sec; 
 
} 
 

 
function stopClock() { 
 
    window.clearInterval(clock); 
 
    sec = 0; 
 
    document.getElementById("timer").innerHTML = 0; 
 
    clicked = false; 
 
} 
 

 
var min = 0; 
 
var second = 00; 
 
var zeroPlaceholder = 0; 
 
var counterId = setInterval(function() { 
 
    countUp(); 
 
}, 1000); 
 

 
function countUp() { 
 
    second++; 
 
    if (second == 59) { 
 
    second = 00; 
 
    min = min + 1; 
 
    } 
 
    if (second == 10) { 
 
    zeroPlaceholder = ''; 
 
    } else 
 
    if (second == 00) { 
 
    zeroPlaceholder = 0; 
 
    } 
 

 
    document.getElementById("count-up").innerText = min + ':' + zeroPlaceholder + second; 
 
}
<div class="timer"> 
 
    <div id="count-up">0:00</div> 
 
    
 
    <input type="button" id="btnParentButton" value="start timer" onClick="startClock()"/>