JavaScript-Projekte


Roll the dice

Run the script.

<!DOCTYPE html>
<html>



<head>

<meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
       
  <title>Roll the dice</title>
 
    <style>

    h2,h3,p,label {
    font-family:sans-serif;
    }
   
    div {
  float: left;
    }
   
   
    </style>
 
</head>


<body>

<h2>Roll the dice</h2>

<p>Choose number of dice in the game</p>
<select id="anzahl">
  <option value="2">2</option>
  <option value="5">5</option>
  <option value="10">10</option>
  <option value="50">50</option>
</select>

<br>
<br>

<button type="button" id="myBtn" onclick="wuerfel()">Roll the dice</button>

<br>
<br>

<div id="demo">

</div>


<script>        
     
        function rollewuerfel() {
        var zufallszahl = Math.random() * 6;
        return (Math.floor(zufallszahl+1));
        }
           
        function wuerfel() {
        var wz = document.getElementById("anzahl").value;  
            for(var i = 1;i <= wz;i++){
   
            var x = (rollewuerfel());
           
            var y = document.createElement("IMG");
            y.setAttribute("src", "images/"+x+".png");
            y.setAttribute("width", "100");    
            document.getElementById("demo").appendChild(y);                    
            }
        }
</script>

</body>
</html>

Zeiterfassung

Skript hier starten.

<!DOCTYPE html>
<html>



<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Zeiterfassung 2 - Feierabend-Berechnung</h2>

<p id="demo"></p>

Dienstbeginn Stunden/Minuten

<input type="text" id="kommen"/>

<input type="text" id="kmin" onblur="Calculate();"/><br />

<br />

<form name ="testarea" Method="Get" Action="youpage.html" id='form1'>
Feierabend ab (Soll) <input type="text" id="answer1" name="ans" />
</form>

<br />

Dienstende Stunden/Minuten

<input type="text" id="gehen"/>

<input type="text" id="gmin" onblur="Calculate();"/><br />

<br />

<form name ="testarea2" Method="Get" Action="youpage2.html" id='form2'>
Arbeitszeit (Ist) <input type='text' id='answer2' name='ans' />
</form>

<script>
function Calculate()
{
    var kommen = parseInt(document.getElementById('kommen').value);
    var kmin = parseInt(document.getElementById('kmin').value);
    var gehen = parseInt(document.getElementById('gehen').value);
    var gmin = parseInt(document.getElementById('gmin').value);
   
    if (kommen>24 || gehen>24){
    document.getElementById('demo').innerHTML = "Stunden: Nur Werte zwischen 0-24 Uhr";
    }
 
    else if (kommen<0 || gehen<0){
    document.getElementById('demo').innerHTML = "Stunden: Nur Werte zwischen 0-24 Uhr";
    }
   
    else if (kmin>59 || gmin>59){
    document.getElementById('demo').innerHTML = "Minuten: Nur Werte zwischen 0 und 59";
    }
   
    else if (kmin<0 || gmin<0){
    document.getElementById('demo').innerHTML = "Minuten: Nur Werte zwischen 0 und 59";
    }
 
    // answer1 = Feierabend
 
    else{  
    var erghk = kommen+8;
    var ergmk = kmin+30;  
    var erghg = gehen;
    var ergmg = gmin-30;
   
    document.getElementById('answer1').value = erghk+":"+ergmk+" h";
   
    if(ergmk < 0){
   
    erghk = erghk-1;
    ergmk = 60+ergmk;
   
        if(erghk < 10){      
        document.getElementById('answer1').value = "0"+erghk+":"+ergmk+" h";
       
        }
                   
        else if(erghk < 10 && ergmk < 10){
        document.getElementById('answer1').value = "0"+erghk+":0"+ergmk+" h";
         
        }
           
        else if(ergmk < 10){          
        document.getElementById('answer1').value = erghk+":0"+ergmk+" h";
       
        }
       
        else {
        document.getElementById('answer1').value = erghk+":"+ergmk+" h";
       
        }  
    }    
   
    else{
   
        if(erghk < 10){      
        document.getElementById('answer1').value = "0"+erghk+":"+ergmk+" h";
       
        }
       
        else if(ergmk < 10){          
        document.getElementById('answer1').value = erghk+":0"+ergmk+" h";
       
        }
       
        else if(erghk < 10 && ergmk < 10){
        document.getElementById('answer1').value = "0"+erghk+":0"+ergmk+" h";
   
                    }
       
        else {
        document.getElementById('answer1').value = erghk+":"+ergmk+" h";
       
                    }
        }  
       
       
        // Arbeitzeit
       
        var azh = gehen - kommen;
        var azmin = gmin - kmin;
       
        if (azh > 6){
            azmin = azmin - 30;
       
            if(azmin < 0){
   
                azh = azh-1;
                azmin = 60+azmin;
           
                if(azh < 10){      
                document.getElementById('answer2').value = "0"+azh+":"+azmin+" h";
                }
                   
                else if(azh < 10 && azmin < 10){
                document.getElementById('answer2').value = "0"+azh+":0"+azmin+" h";
                }
           
                else if(azmin < 10){          
                document.getElementById('answer2').value = azh+":0"+azmin+" h";
                }
       
                else {
                document.getElementById('answer2').value = azh+":"+azmin+" h";
                }  
            }    
   
            else{
   
                if(azh < 10){      
                document.getElementById('answer2').value = "0"+azh+":"+azmin+" h";
                }
       
                else if(azh < 10){        
                document.getElementById('answer2').value = azh+":0"+azmin+" h";
                }
       
                else if(azh < 10 && azmin < 10){
                document.getElementById('answer2').value = "0"+azh+":0"+azmin+" h";
                }
       
                else {
                document.getElementById('answer2').value = azh+":"+azmin+" h";
                }
            }            
        }

    }
}    
</script>

</body>
</html>