basti1012.bplaced.net

Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
    Einen Timer mit Localstorage erstellen mit einfacher Dropdown Auswahl ( zb 1,2,3 Stunden)

    Code

                                        
                                    Ende in <select id="stunden">
      <option>1</option>
        <option>2</option>
        <option>3</option>
    </select> Stunden 
    <input type="button" id="start" value="start">
    <div id="ende"></div>
    <div id="rest"></div>
      <script>
      var timer;
    var ausgabeende=document.getElementById('ende');
    var ausgaberest=document.getElementById('rest');
    var but=document.getElementById('start');
    but.addEventListener('click',function(){
         clearInterval(timer);
         ende=document.getElementById('stunden').value*3600;
         beginn=Math.round(new Date().getTime()/1000);
         localStorage.setItem('counter',beginn+ende)
         counter(beginn+ende);
         endfunction();
    })
    function endfunction(){
        if(localStorage.getItem('counter')){
           jetzt=Math.round(new Date().getTime()/1000);
           if(localStorage.getItem('counter')>=jetzt){
               var endtime = new Date(localStorage.getItem('counter')*1000);
               ausgabeende.innerHTML='<h5>Counter endet am</h5>'+endtime+'<br>';
               counter(localStorage.getItem('counter'));
           }
        }else{
          console.log('Kein Timer')
        }
    }
    
     function counter(counterende){
        timer=setInterval(function(){
           var geradejetzt=Math.round(new Date().getTime()/1000);
           if(counterende>=geradejetzt){
               var resttime=counterende-geradejetzt;
               ausgaberest.innerHTML='<h4>Restzeit in Sekunden</h4>'+resttime;  
           }else{
               ausgaberest.innerHTML='<h4>Timer abgelaufen</h4>';  
               localStorage.removeItem('counter');
               clearInterval(timer);
           }    
        },1000)
     } 
    endfunction()  
        
    </script>