Tehtävien ajastus 2 setInterval
JavaScriptissä toinen tapa hidastaa tapahtumien kulkua on käyttää
setInterval("tehtävä", odotusaika millisekunteina)
-metodia. Tässä on se hyvä puoli, ettei rekursiota tarvita, vaan toisto jatkuu loputtomiin.
Alla esimerkki laskurista, joka tulostaa luvut näytölle 0,2 sekuntin välein:
Koodi | Koodin tulos |
---|---|
<script type="text/javascript">
var luku = 0;
// ajastin-muuttujan avulla toisto saadaan loppumaan.
var ajastin = 0;
function starttaa(){
ajastin = setInterval("kasvata_lukua()",200);
}
function kasvata_lukua(){
luku = luku+1;
document.getElementById("laskuri").innerHTML = luku;
}
// Tämä pysäyttää laskurin:
function pysayta_laskuri(){
clearInterval(ajastin);
}
</script>
|
Tämän lisäksi yllä tarvitaan laskuri-elementti ja painikkeet "Käynnistä laskuri" ja "Pysäytä laskuri":
<button type="button" onclick="starttaa()">Käynnistä laskuri</button>
<button type="button" onclick="pysayta_laskuri()">Pysäytä laskuri</button>
<div id = "laskuri" style="font-size: 5cm"></div>