Issue with javascript timer

Question

I wrote a timer code via JavaScript. I want to stop this timer when I click on a button, and restart it by double clicking the same button, however, it currently only works once.

Here is the code:

let pElement = document.createElement('p');
document.body.appendChild(pElement);

let liveTimer = () => {
  let date = new Date();
  let onlineTime = date.toLocaleTimeString();

  pElement.innerHTML = onlineTime;
};

let setI = setInterval(liveTimer, 1000);

function stopTime() {
  clearInterval(setI);
}

function startTimer() {
  setInterval(liveTimer, 1000);
}

<button onclick="stopTime()" ondblclick="startTimer()">click me</button>

stackoverflow.com/questions/36733692/…

mplungjan
– mplungjan

2019-11-12 13:51:30 +00:00
Commented Nov 12, 2019 at 13:51 — mplungjan
– mplungjan, Commented Nov 12, 2019 at 13:51

nick zoum · Accepted Answer · 2019-11-12 13:37:35Z

3

You forgot to set the interval-Id the second time you are calling setInterval inside the startTimer function.

Just because you set the value here let setI= setInterval(liveTimer,1000);, doesn't mean that the value will get refreshed when you do setInterval(liveTimer,1000);. This will return a different value that you need to store inside a variable.

let pElement = document.createElement('p');
document.body.appendChild(pElement);


let liveTimer = () => {
  let date = new Date();

  let onlineTime = date.toLocaleTimeString();

  pElement.innerHTML = onlineTime;

};

let setI = setInterval(liveTimer, 1000);

function stopTime() {
  clearInterval(setI);
}


function startTimer() {
  setI = setInterval(liveTimer, 1000);
}

<button onclick="stopTime()" ondblclick="startTimer()">click me</button>

edited Nov 12, 2019 at 13:37

answered Nov 12, 2019 at 13:31

nick zoum

6,6538 gold badges43 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

mplungjan Over a year ago

Come to think of it, it is a typo-type question and can be closed

roz333 Over a year ago

I really appreciate it

nick zoum Over a year ago

@mplungjan Just because the solution sounds obvious once its been stated, doesn't mean that the problem was a typo. I would say that problem was closer to a syntax error in the sense that the user didn't know that value doesn't get bound to the interval.

mplungjan Over a year ago

There is no "close as syntax error" to choose. Typo-type covers this too

nick zoum Over a year ago

@mplungjan Why would it fall under the same category? The problem may have been caused by lack of JavaScript knowledge (without any offense to the OP). Isn't this one of the main reason why SO exists?

|

Collectives™ on Stack Overflow

Issue with javascript timer

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related