<!DOCTYPE html>
<html>
<head>
<meta charset="utf8">
<title>Übung 3b: Idealgewicht mit Form</title>
<script>
// Idealgewichts Funktion
function berechneIdealgewicht(geschlecht, groesse) {
if (geschlecht === 'm') {
idealgewicht = groesse - 100;
}
if (geschlecht === 'w') {
idealgewicht = 0.9 * (groesse - 100);
}
return idealgewicht;
}
</script>
</head>
<body>
<h2>Berechnung Idealgewicht</h2>
//Formular
<form name="idealgewichtForm">
<fieldset>
<legend><strong>Name</strong></legend>
<label for="vorname">Vorname:</label>
<br />
<input id="vorname" name="vorname" type="text" size="20" value="" />
<br />
<label for="nachname">Nachname:</label>
<br />
<input id="nachname" name="nachname" size="20" value="" />
</fieldset>
<fieldset>
<legend><strong>Grösse</strong></legend>
<label for="groesse">Grösse in cm:</label>
<br />
<input name="groesse" id="groesse" type="text" size="10" value="" />
</fieldset>
<fieldset>
<legend><strong>Geschlecht</strong></legend>
<label for="r1">weiblich:</label><br />
<input name="geschlecht" id="r1" type="radio" value="w" checked>
<br />
<label for="r2">männlich:</label><br />
<input name="geschlecht" id="r2" type="radio" value="m" />
</fieldset>
<fieldset>
<legend><strong>Berechnen</strong></legend>
<button type="button" id="berechnen">
Berechne Idealgewicht</button>
</fieldset>
</form>
<script>
document.getElementById('berechnen').addEventListener('click', function() {
var ge;
if (document.getElementById('r1').checked == true) {
ge = 'w';
} else {
ge = 'm';
}
var gr = document.getElementById('groesse').value;
var vor = document.getElementById('vorname').value;
var na = document.getElementById('nachname').value;
alert(vor + ' ' + na + ' \n Ihr Idealgewocht ist ' + berechneIdealgewicht(ge, gr))
})
</script>
</body>
</html>