Javascript таймера обратного отсчета с хранением йота

Question

Может кто-то помочь мне понять, где им будут не так с этим кодом Айвами целых дней на дни, пытаясь получить эту работу, как я нужен JavaScript/DOM таймер, а не JQuery

HTML

<input name="button" type="button" onClick="displaytimer()" value="Play!"> 
<form name="counter"> 
    You have 
    <input type="text" size="8" name="d2"> 
    seconds left to escape! 
</form> 

Javascript

if (localStorage) { 
    var milisec = 0; 
    var seconds = localStorage.seconds || 30; 
    document.counter.d2.value = seconds; 

    function displaytimer() { 
     if (milisec <= 0) { 
      milisec = 9; 
      seconds -= 1; 
     } 

     if (seconds <= -1) { 
      milisec = 0; 
      seconds += 1; 
     } 

     else milisec -= 1; 

     localStorage.seconds = seconds; 
     document.counter.d2.value = seconds + "." + milisec; 

     if (seconds > 0 || (seconds = 0 && milisec > 0)) { 
      setTimeout(displaytimer(), 100); 
     } 

     if (seconds <=0) { 
      window.location="./pages/fail.html"; 
      cleartimer(); 
     } 

     function cleartimer() { 
      localStorage.seconds = seconds; 
      document.counter.d2.value =0; 
     } 

     window.location="./pages/2.html"; 
    } 
} 
else { 
    document.write("dom storage not supported"); 
} 

Answer 1

Попробуйте этот код. Он был изменен, чтобы избежать объявления какой-либо функции внутри другой функции. Кроме того, для простоты использовали setInterval(). Обратите внимание, что onClick() запускает сейчас starttimer().

HTML:

<input name="button" type="button" onClick="starttimer()" value="Play!"> 
<form name="counter"> 
    You have 
    <input type="text" size="8" name="d2"> 
    seconds left to escape! 
</form> 

JS:

if (localStorage) { 
    var milisec = 0; 
    var seconds = localStorage.seconds || 30; 
    document.counter.d2.value = seconds; 
    var timer; 

    function starttimer() { 
     clearInterval(timer); 
     timer = setInterval(displaytimer, 100); 
    } 

    function cleartimer() { 
     localStorage.seconds = seconds; 
     document.counter.d2.value = 0; 
     clearInterval(timer); 
    } 

    function displaytimer() { 
     if (milisec <= 0) { 
      milisec = 9; 
      seconds -= 1; 
     } 
     if (seconds <= -1) { 
      milisec = 0; 
     } else { 
      milisec -= 1; 
     } 
     localStorage.seconds = seconds; 
     document.counter.d2.value = seconds + "." + milisec; 
     if (seconds < 0) { //countdown ended here 
      //window.location="./pages/fail.html"; //put this forward in its appropriate place according to what you want to do 
      cleartimer(); 
     } 
     //window.location="./pages/2.html"; //put this forward in its appropriate place according to what you want to do 
    } 
} 
else { 
    document.write("dom storage not supported"); 
} 

---

Я проверил в этом plunkr, и она работала нормально. http://plnkr.co/edit/acAxRZAHsFVtJoQZ1Ov6