javascript optelklok

[Fredraket27!]

Ik probeer een klok te maken met javascript waar de hele tijd een random getal om de 8 tot 10 seconde word opgeteld, ik heb al een beetje geklooid met een code van een stopwatch maar het lukt maar niet. Heeft iemand nog tips? dit is de code van de stopwatch.

<script>
window.onload = function () {

var seconds = 00;
var tens = 00;
var appendTens = document.getElementById("tens")
var appendSeconds = document.getElementById("seconds")
var buttonStart = document.getElementById('button-start');
var buttonStop = document.getElementById('button-stop');
var buttonReset = document.getElementById('button-reset');
var Interval ;


buttonStart.onclick = function() {

clearInterval(Interval);
Interval = setInterval(startTimer, Math.floor(Math.random() * 500) + 700);
}

buttonStop.onclick = function() {
clearInterval(Interval);
}


buttonReset.onclick = function() {
clearInterval(Interval);
tens = "00";
seconds = "00";
appendTens.innerHTML = tens;
appendSeconds.innerHTML = seconds;
}



function startTimer () {
tens++;

if(tens <= 9){
appendTens.innerHTML = "0" + tens;
}

if (tens > 9){
appendTens.innerHTML = tens;

}

if (tens > 99) {
console.log("seconds");
seconds++;
appendSeconds.innerHTML = "0" + seconds;
tens = 0;
appendTens.innerHTML = "0" + 0;
}

if (seconds > 9){
appendSeconds.innerHTML = seconds;
}

}


}
</script>

 

[roon]

Hieronder het stukje over een random getal tussen 2 waardes met een timer. Je kan dit zelf met je eigen code aanvullen

Eerst een functie om een random getal te krijgen tussen een min(imum) en max(imum) heel getal. Die kan je gebruiken waar dat nodig is. Code snippet vind je op MDN.

function getRandom (min, max) {
    let Random = Math.random() * (max - min) + min;
    return Math.floor(Random);
}

De eenvoudigste manier is om een setTimeout een functie aan te laten roepen waar de setTimeout zelf in zit. Hier roept de setTimeout na 1000 msec opnieuw de functie TimeOut aan en dat blijft zo door gaan.

// html:  <span id="tens">00</span>
const appendTens = document.getElementById("tens");

// een random getal tussen 80 en 100 met vaste interval 1 sec.
var TimeOut = function() {
    appendTens.innerHTML = getRandom(80, 100);
    setTimeout(TimeOut, 1000);
}
setTimeout(TimeOut, 1000);

Als je ook de intervaltijd variabel wilt hebben dan is het uitgebreider

// html:  <span id="tens">00</span>
const appendTens = document.getElementById("tens");

// hetzelfde maar dan variabele interval (hier 0.5 - 2.5 sec)
var Interval = getRandom(500, 2500);
var TimeOut = function() {
    appendTens.innerHTML = getRandom(80, 100);
    Interval = getRandom(500, 2500);
    setTimeout(TimeOut, Interval);
}
setTimeout(TimeOut, Interval);