Таймер запускается автоматически, а не при нажатии кнопки javascript

Я пытаюсь создать таймер, который запускается после нажатия кнопки, а затем сбрасывается, как только нажимается другая кнопка. однако таймер запускается автоматически, как только приложение запускается и не возвращается к 0. Любая помощь будет принята с благодарностью.Таймер запускается автоматически, а не при нажатии кнопки javascript

Timer.js

var sec = 0; 

function pad(val) 
{ 
    return val > 9 ? val : "0" + val; 
} 

interval = setInterval(function() 
{ 
    document.getElementById("seconds").innerHTML=pad(++sec%60); 
    document.getElementById("minutes").innerHTML=pad(parseInt(sec/60,10)); 
}, 1000); 

function clearTimer() 
{ 
    clearInterval(interval); 
}

Сценарии пользователя

$(document).on("click", "#RunningTrackerBackBtn", function(evt) 
{ 

    clearTimer(); 

}); 

    $(document).on("click", "#TrackerTest", function(evt) 
{ 
    /*global activate_subpage */ 
    activate_subpage("#TrackerPage"); 
    setInterval();   
});

index.html

<span id="minutes">00 minutes </span>:<span id="seconds"> 00 seconds</span>

источник

2016-05-04 Anonymous5642

Ну, вы вызываете 'setInterval()' сразу же, когда включен «Timer.js», вот что запускает таймер. – millimoose

Tangential: это неточный способ отслеживать время, вы не имеете гарантии, что обработчик 'setInterval()' выполняется ровно один раз каждые 1000 миллисекунд. Вместо увеличения второго счетчика вы должны сохранить время начала и сравнить его с временем, когда вы обновляете дисплей. Обработчик также должен работать чаще, чем один раз в секунду. – millimoose

Вот полный пример :

HTML:

<span id="minutes">00 minutes</span>:<span id="seconds">00 seconds</span> 

<button id= "start">Start</button> 
<button id= "stop" >Stop</button> 
<button id= "clear" >Clear</button>

JS:

var sec = 0; 
var interval; 

function pad(val) { 
    return val > 9 ? val : "0" + val; 
} 

function showTime() { 
     document.getElementById("seconds").innerHTML= pad(sec++%60) + ' seconds'; 
     document.getElementById("minutes").innerHTML= pad(parseInt(sec/60,10)) + ' minutes'; 
} 

function start() { 
    interval = setInterval(function() { 
     showTime(); 
    }, 1000); 
}; 

function clearTimer() { 
    clearInterval(interval); 
    sec = 0; 
    showTime(); 
} 

function stopTimer() { 
    clearInterval(interval); 
} 
$("#start").on('click', function() { 
     start(); 
}); 

$("#stop").on('click', function() { 
     stopTimer(); 
}); 

$("#clear").on('click', function() { 
     clearTimer(); 
});

Идущие в JSFiddle: https://jsfiddle.net/5sauhj8d/8/

источник

2016-05-04 23:04:15

Где именно это актуально? Эти промежутки просто обновляются, когда таймер отсчитывает время, и это сделано правильно в OP. – millimoose

Поместите setInterval код внутри новой функции:

function startCounter() { 
    interval = setInterval(function() 
    { 
     document.getElementById("seconds").innerHTML=pad(++sec%60); 
     document.getElementById("minutes").innerHTML=pad(parseInt(sec/60,10)); 
    }, 1000); 
}

И это то, что вы должны вызвать при нажатии кнопки.

источник

2016-05-04 23:11:32 yelsayed

Таймер запускается автоматически, а не при нажатии кнопки javascript

ответ

Смежные вопросы