как создать событие клика для отображения установленного интервала времени

Question

У меня есть функция setInterval Javascript, настроенная для отображения как таймер.Я хотел бы отобразить время, которое находится на таймере при нажатии кнопки «Далее», чтобы пользователь мог видеть, сколько времени они провели на определенной странице.Я не уверен, как связать setInterval с событием click.Это то, что у меня есть, но оно не работает.

let timerId = setInterval(function () {
        document.getElementById("seconds").innerHTML = pad(++sec % 60);
        document.getElementById("minutes").innerHTML = pad(parseInt(sec / 60, 10));
    }, 1000);
    function myFunction() {
  alert document.getElementById("timerId").innerHTML = "Time passed: " + timerId);
} 

Answer 1

Это должно решить вашу проблему.

var initialTime = new Date().getTime();
var timeSpent='0:00';
var timeElement = document.getElementById("time");

timeElement.innerHTML = timeSpent;

let timerId = setInterval(function () {
        var currentTime = new Date().getTime();
        timeSpent = millisToMinutesAndSeconds(currentTime - initialTime)
        timeElement.innerHTML = timeSpent;
    }, 1000);
    
function millisToMinutesAndSeconds(millis) {
  var minutes = Math.floor(millis / 60000);
  var seconds = ((millis % 60000) / 1000).toFixed(0);
  return minutes + ":" + (seconds < 10 ? '0' : '') + seconds;
}

  function alertFn(){alert(timeSpent)}
 document.getElementById("rightButton").addEventListener('click',alertFn);

 document.getElementById("wrongButton").addEventListener('click',alertFn);

<h1 id="time"></h1>
<button id="rightButton">Right</button>
<button id="wrongButton">Wrong</button>

Answer 2

Прежде всего, было бы лучше, если бы вы поместили метод setInterval внутри функции.После этого вы можете передать свою функцию слушателю события в качестве аргумента.

Ваш код должен выглядеть примерно так:

let timerId;
function displayTime() {
    timerId = setInterval(() => {
        // your code

    }, 1000);
}

document.querySelector('button').addEventListener('click', displayTime)