Estoy tratando de crear un reloj digital usando JavaScript y tengo un problema. El reloj digital aparece y la hora es correcta. Sin embargo, no se actualiza cada segundo, aunque el setinterval parece ser correcto.
window.onload = pageLoad; function pageLoad(){ var hours = document.getElementById("hoursOut"); var mins = document.getElementById("minsOut"); var secs = document.getElementById("secsOut"); var dateVar = new Date(); var currentHours = dateVar.getHours(); var currentMinutes = dateVar.getMinutes(); var currentSeconds = dateVar.getSeconds(); var tiktok; function displayTime() { hours.innerHTML = currentHours + ":"; mins.innerHTML = currentMinutes + ":"; secs.innerHTML = currentSeconds; } function startClock(){ displayTime(); tiktok = setInterval(displayTime,1000); } } ```Debe actualizar el valor de Fecha () para cada segundo
Ponga Date() dentro de su función displayTime()
Aquí ejemplo:
function displayTime() { var dateVar = new Date(); var currentHours = dateVar.getHours(); var currentMinutes = dateVar.getMinutes(); var currentSeconds = dateVar.getSeconds(); hours.innerHTML = currentHours + ":"; mins.innerHTML = currentMinutes + ":"; secs.innerHTML = currentSeconds; }Código completo:
window.onload = () => { var hours = document.getElementById("hoursOut"); var mins = document.getElementById("minsOut"); var secs = document.getElementById("secsOut"); var tiktok; function displayTime() { var dateVar = new Date(); var currentHours = dateVar.getHours(); var currentMinutes = dateVar.getMinutes(); var currentSeconds = dateVar.getSeconds(); hours.innerHTML = currentHours + ":"; mins.innerHTML = currentMinutes + ":"; secs.innerHTML = currentSeconds; } function startClock(){ displayTime(); tikstok = setInterval(displayTime,1000); } // call function startClock(); };Puede hacer esto usando la función setInterval .
Algo que debe saber sobre setInterval: la función setInterval devuelve una identificación desde la cual puede detener setInterval usando la función clearInterval (id) , donde id sería la identificación devuelta por la función setInterval.
Además, debe obtener el valor de la fecha actual, así que cambie su función displayTime de esta manera:
function displayTime() { var dateVar = new Date(); var currentHours = dateVar.getHours(); var currentMinutes = dateVar.getMinutes(); var currentSeconds = dateVar.getSeconds(); hours.innerHTML = currentHours + ":"; mins.innerHTML = currentMinutes + ":"; secs.innerHTML = currentSeconds; } let id ; function startClock() { displayTime(); id = setInterval(displayTime, 1000); }; startClock();Por ejemplo :
let id ; function startClock() { id = setInterval(()=>console.log(new Date().getMinutes()+"min" ), 1000); }; startClock();Tienes que refactorizar tu código para que sea como a continuación.
function startClock() { displayTime(); // Defined in your example setInterval(displayTime, 1000); }; startClock();