JS: Wie programmiere ich einen Start/Stop Knopf, der Stopuhr startet und stoppt?

Hallo Leute,

ich versuche gerade eine Stoppuhr zu programmieren. Jedoch komme ich bei dem Start/Stop Knopf nicht mehr weiter, welcher die Stoppuhr bzw. die bisherige Zeit stoppt. Wie programmiere ich nun mit JS den Knopf so, dass er die Zeit nicht nur startet, sondern auch stoppt

Vielen Dank im Voraus :=)

Answer 1

[MagisterSamael]

Ave!

Generell solltest du abfragen, ob die Stoppuhr bereits läuft und sie dann entsprechend stoppen.

Das bedeutet: Du setzt eine Variable wie "läuft der Timer?" auf true, sobald du ihn startest und fragst das ab, sobald der Knopf abermals gedrückt wurde.

Ist die Variable false (oder null) wird er gestartet, ansonsten gestoppt.

Als Beispiel wie ich es lösen würde:

let timerRunning = false,
    startTime,
    interval;

function switchState(){
    timerRunning ? stopTimer() : startTimer();
}

function startTimer(){
    timerRunning = true;
    startTime = Date.now();
    interval = setInterval(updateTime, 100);
}

function stopTimer(){
    timerRunning = false;
    clearInterval(interval);
    updateTime();
}

function updateTime(){
    currentTime = Date.now() - startTime;
}

Du brauchst bei meinem Code im Grunde nur zwei Dinge erledigen:

• switchState() auf den Button legen um starten/stoppen zu lassen
• currentTime in "updateTime()" auf deinen Output ausgeben lassen.

Ich hoffe ich konnte mit meinem Beispiel helfen.

PS: Der bedingte ternäre Operator ( var ? true : false ) in "switchState()" ist eine abgekürzte if-Anweisung.

Ausgeschrieben ist es dasselbe wie:

if (timerRunning){
  stopTimer()
}else{
  startTimer()
}

Ich hoffe ich konnte helfen :)

Answer 2

[WhiteBuddha]

Ich denke auch das kannst du mit einer simplen If-Abfrage lösen. Invertiere eine Booleanvariabel beim drücken. Wenn es true ist Stoppuhr starten, wenn er false ist Stoppuhr stoppen.

Also wenn Event von deinem Knopf und Booleanvariabel true dann dass... Wenn Event vom Knopf und Boolean false dann dass...

Answer 3

[jort93]

Wenn du schon einen Start Knopf hast musst du nur überprüfen ob die zeit aktuell läuft und dann unterschiedlich handeln.

Ohne den code zu kennen kann man dir nicht weiter helfen.