<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@*" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body onload="reis()">
<h1>Reiskörner auf Schachbrett</h1>
<p>
Schachbrett hat 64 Felder, auf dem ersten liegt 1 Reiskorn, dann wird immer verdoppelt.
<br>
1, 2, 4, 8, 16, ...
<br>
Wieviel kg hat es insgesamt, wenn 1 Korn 30mg wiegt?
</p>
<form>
<div >
Feld
<input id="feld" type="text" disabled="disabled"/>
</div>
<div>
Anzahl
<input id="anzahl" type="text" disabled="disabled"/>
</div>
<div>
Gewicht in Tonnen
<input id="gewicht" type="text" disabled="disabled"/>
</div>
</form>
</body>
</html>
function reis() {
var feld = 1;
var anzahlReisKoernerFeld = 1;
var timer;
var gewichtKornKg = 0.03 / 1000;
var gewichtTotalTonnen;
timer = setInterval(function() {
if (feld < 64) {
feld++;
anzahlReisKoernerFeld = anzahlReisKoernerFeld * 2;
anzahlTotal = anzahlReisKoernerFeld * 2 - 1;
gewichtTotalTonnen = anzahlTotal * gewichtKornKg / 1000 ;
$("#feld").val(feld);
$("#anzahl").val(anzahlTotal);
$("#gewicht").val(gewichtTotalTonnen);
} else {
// in 10 Sekunden neu starten
clearTimeout(timer);
setTimeout(function() {
reis();
}, 10000);
}
}, 500);
}
/* Styles go here */
h1 {
font-size: 20px;
}
input {
width: 100%;
font-size: 120%;
font-weight: bold;
}