Hallo zusammen,
ich habe gerade mal wieder nen neuen Anlauf genommen etwas in html/JS zu programmieren und blick nicht ganz weshalb er den Timer im Bild nur beim debuggen runterzählt.
Gibt's da ähnlich wie bei vba einen Befehl wie doevents oder was müsste ich hier ändern das er mir das auch anzeigt?
Grüße und vielen Dank!
Markus
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE-edge" />
<meta name="VIEWPORT" content="WIDHT-DEVICE-WIDTH, initial-scale=1.0" />
<title>DOCUMENT</title>
<link rel="manifest" href="manifest.json" />
<style type="text/css">
.background-dark {
background-color: #262626;
}
.center {
display: flex;
justify-content: center;
}
.margin-top {
margin-top: 100px;
}
.timer {
font-size: 60px;
color: white;
font-family: "Roboto", sans-serif;
}
</style>
</head>
<body class="background-dark">
<div>
<img src="img/menu.png" width="60" />
</div>
<div class="center margin-top">
<img src="img/ei.png" width="60" />
</div>
<div class="center margin-top timer" id="timer">05 : 00</div>
<div class="center margin-top timer">
<img onclick="starttimer()" src="img/button.png" />
</div>
<script>
function sleep(num) {
let now = new Date();
let stop = now.getTime() + num;
while (true) {
now = new Date();
if (now.getTime() > stop) return;
}
}
function starttimer() {
let starttime = new Date().getTime();
let fiveminutes = 1000 * 5;
let endtime = starttime + fiveminutes;
let timeleft = endtime - new Date().getTime();
//console.log(timeleft);
do {
timeleft = endtime - new Date().getTime();
let minutes = timeleft / (1000 * 60);
minutes = Math.floor(minutes);
let sek = (timeleft / 1000) % 60;
sek = Math.round(sek);
sek = ("0" + sek).slice(-2);
let texto = "0" + minutes + " : " + sek; //sorgt dafür das bei den letzten 9 Sekundnen auch eine 0 davor steht
document.getElementById("timer").innerHTML = texto;
//delay(1000);
//setTimeout(() => {}, 1000);
sleep(1000);
console.log("0" + minutes + " : " + sek);
} while (timeleft > 0);
document.getElementById("timer").innerHTML = "00 : 00";
let alarm = new Audio("Alarm.m4a");
alarm.play();
}
</script>
<button onclick="myfunction()">Click me</button>
<script>
function myfunction() {
document.getElementById("test").innerHTML = "Hallo Welt";
}
</script>
<p class="center margin-top timer" id="test"></p>
</body>
</html>
Alles anzeigen