2016-06-05 10 views
1
<!doctype HTML> 
<html> 
    <head> 
     <title>timer</title> 
     <script> 
     function timer(button){ 
      var btn = document.getElementById("button1").value; 
      var status; 
       if(btn == "Start"){ 
        button.value = "Stop"; 
        status = true; 
       }; 
       if(btn == "Stop"){ 
        button.value = "Start"; 
        status = false; 
        }; 
      var time = document.getElementById("numberinput").value; 

      time = ++time; 
      decrement(); 
      function decrement(){ 
       if(time > 0 && btn == "Start" && status == true){ 
        time = --time; 
        document.getElementById("result").innerHTML = time; 
        var to = setTimeout(decrement, 1000); 
       }; 
      }; 
     }; 

    </script> 
</head> 
<body> 
<center> 
    <div id="info">Enter the number of secounds</div> 
     <form id="form1"> 
      <input type="number" id="numberinput"><br /> 
      <input type="button" id="button1" onclick="timer(this)" value="Start"> 
      <div id="result"></div> 
     </form> 
</center> 
</body> 

Javascript-Countdown nur ein wenig Timer nicht

arbeiten Warum dieser Code funktioniert dieser Code nicht?

Es sollte eine Zeit sein, die zählt.

Der Startknopf funktioniert richtig, aber der Stopp nicht.

Ich wäre wirklich hilfreich, wenn mir jemand erklären könnte, warum das nicht funktioniert und geben Sie mir ein Beispiel, wie Sie das lösen können.

danke!

Antwort

1

Sie waren auf dem richtigen Weg, hatten aber einige allgemeine Programmierverfahren falsch.

  • time = --time; als time--; (gleich für ++)
  • I Funktionen innerhalb von Funktionen erklären würde persönlich nicht geschrieben werden (decrement())
  • senden Werte als Parameter an andere Funktionen
  • setTimeout() Bedürfnisse haben sein erster Parameter als anonyme Funktion (etwas komisch, aber muss passieren)

Hier ist Ihr Arbeitscode:

window.timer = function(button){ 
    var btn = document.getElementById("button1").value; 
    var status; 
    if(btn == "Start"){ 
     button.value = "Stop"; 
     status = true; 
    }; 
    if(btn == "Stop"){ 
     button.value = "Start"; 
     status = false; 
    }; 
    var time = document.getElementById("numberinput").value; 
    document.getElementById("result").innerHTML = time; 
    decrement(time, status); 
}; 

window.decrement = function(time, status){ 
    var btn = document.getElementById("button1").value; 
    if(time > 0 && btn == "Stop" && status == true){ 
     time--; 
     document.getElementById("result").innerHTML = time; 
     var to = setTimeout(function() { 
      decrement(time, status); 
     },1000); 
    }; 
}; 

JSFiddle: https://jsfiddle.net/8fmn4src/

+0

'setTimeout() muss seinen ersten Parameter als anonymer function' nicht genau haben. Es muss eine "Funktionsreferenz" sein, die eine anonyme Funktion sein kann, oder eine Referenz auf eine regulär benannte Funktion. –

+0

Die reguläre benannte Funktion hat bei mir nie funktioniert. Es gibt viele SO-Fragen, die diese Strategie zeigen. Aber ja. Nicht erforderlich – theblindprophet

+0

Wäre es möglich, wenn Sie auf Stopp drücken, dass die Zeit einfach stoppt und nicht zurückgesetzt wird, und dass Sie von dem Punkt aus fortfahren könnten, an dem Sie die Zeit angehalten haben? Vielen Dank! – Kamil

Verwandte Themen