Beiträge von dwedNJKD123
-
-
Ah brauchte noch den Boolean. Blöd das es ohne den nicht geht. Finde er sollte doch mit dem clear rauskommen.
HTML
Alles anzeigen<!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> let timerstarted = false; function starttimer() { if (!timerstarted) { let starttime = new Date().getTime(); let fiveminutes = 1000 * 5; let endtime = starttime + fiveminutes; let interval = setInterval(function() { let timeleft = endtime - new Date().getTime(); if (timeleft > 0) { 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; } else { document.getElementById("timer").innerHTML = "00 : 00"; let alarm = new Audio("Alarm.m4a"); alarm.play(); clearInterval(interval); } }, 1000); timerstarted = true; } } </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>
-
Blick's nur nicht warum das so nicht geht.
HTML
Alles anzeigen<!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 starttimer() { let starttime = new Date().getTime(); let fiveminutes = 1000 * 5; let endtime = starttime + fiveminutes; let interval = setInterval(function() { let timeleft = endtime - new Date().getTime(); if (timeleft > 0) { 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; } else { document.getElementById("timer").innerHTML = '00 : 00'; let alarm = new Audio('Alarm.m4a'); alarm.play(); //var IntervalId = setInterval(fname, 10000); clearInterval(Interval); } }, 1000); } </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>
-
Hi Lukas,
danke dir. Ich hatte das zuvor auch mit Intervall gemacht aber bin mit dem clearinterval nicht rausgekommen.
Kucke mir jetzt mal an deinem Beispiel an was mein Fehler war.
Vielen herzlichen Dank dir!
-
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
Alles anzeigen<!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>