Het is mogeijk om functies aan te roepen na een bepaalde tijd. Zo kun je bijvoorbeeld een bericht geven als iemand al 15 minuten op de pagina is. Ook is het mogelijk om een functie iedere zoveel seconde te laten uitvoeren. Heb je bijvoorbeeld een klok op jouw site, dan kun je de tijd iedere seconde bijwerken. De functies die je hiervoor gebruikt zijn: setTimeout() en setInterval().
Wacht 5 seconden op de begroeting:
const myTimeout = setTimeout(myGreeting, 5000);
Gebruik clearTimeout(myTimeout) om te voorkomen dat myGreeting wordt uitgevoerd:
const myTimeout = setTimeout(myGreeting, 5000);
function myStopFunction() {
clearTimeout(myTimeout);
}
De setTimeout()methode roept een functie aan na een aantal milliseconden.
1 seconde = 1000 milliseconden.
setTimeout() wordt slechts één keer uitgevoerd.
Als je iets met een interval wilt uitvoeren, bijvoorbeeld iedere 2 seconden dan gebruik je setInterval().
Gebruik de clearTimeout() methode om de timeout methode te stoppen als je deze hebt aangeroepen.
Om een time-out te stoppen gebruikt je het id wat is geretourneerd door setTimeout():
myTimeout = setTimeout(function, milliseconds);
Vervolgens kunt u de uitvoering stoppen door clearTimeout() aan te roepen:
clearTimeout(myTimeout);
Nog een voorbeeld
let x = document.getElementById("txt");
setTimeout(function(){ x.value = "2 seconds" }, 2000);
setTimeout(function(){ x.value = "4 seconds" }, 4000);
setTimeout(function(){ x.value = "6 seconds" }, 6000);
Geef elke seconde "Hallo" weer (1000 milliseconden):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Roep displayHello elke seconde aan:
setInterval(displayHello, 1000);
De setInterval() methode roept een functie aan op gespecificeerde intervallen (in milliseconden).
De setInterval() methode blijft de functie aanroepen totdat deze clearInterval() wordt aangeroepen of het venster wordt gesloten.
Gebruik setTimeout() in plaats van de methode setInterval() om de functie slechts één keer uit te voeren.
Gebruik de id die is geretourneerd door setInterval() om een interval te wissen:
myInterval = setInterval(function, milliseconds);
Vervolgens kunt je de uitvoering stoppen door clearInterval() aan te roepen:
clearInterval(myInterval);