Verschachtelte If Else Funktionn gibt mir immer nur letzte Else zurück
Hallo zusammen
Ich bin Rookie im Bereich der Programmierung und habe erst vor ca. einem Monat mit HTML/CSS/JS angefangen. Aus diesem Grund sehe ich manchmal die Fehler nicht und hoffe auf euren Input ^^
Ich habe eine verschachtelte If Else Funktion ( unter function holeplan() ). Irgendwie zeigt es mir immer nur die letzte Else-Funktion an. Was mache ich falsch?
Danke euch!
PS: Lasst euch nicht von diesen knalligen Farben irritieren, die brauchte ich als Orientierung für die Arbeit mit DIV Layouts :D wie gesagt, Rookie..
Der hier verwendete Code
<style>
.container {
background-color:yellow;
}
.containerlinksrahmen {
background-color:green;
display:inline-block;
vertical-align:middle;
margin-left:20px;
margin-top:20px;
}
.containerrechtsrahmen {
background-color:gray;
display:inline-block;
vertical-align:middle;
margin-left:20px;
margin-top:20px;
}
.containerlinks {
background-color:red;
display:inline-block;
width:480px;
vertical-align:top;
}
.containerrechts {
background-color:blue;
display:inline-block;
width:500px;
vertical-align:top;
}
.btncont {
width:71%;
background-color:red;
}
.btnareacontainer {
background-color:green;
width:355px;
height:90px;
margin: auto;
}
.btn1 {
background-color:deeppink;
width:145px;
height:40px;
display:inline-block;
margin-top:20px;
margin-top: 15px;
}
.btn2 {
background-color:coral;
width:145px;
height:40px;
display:none;
}
.btnabstand {
background-color:red;
width:50px;
display:inline-block;
}
.ersteslabel {
width: 260px;
display: inline-block;
font-family: Arial;
color: #ffffff;
font-size:14px;
}
.line{
margin:5px;
color:white;
}
.zweiteslabel {
width: 260px;
display: inline-block;
font-family: Arial;
color: #ffffff;
font-size:14px;
}
input {
width: 120px;
height: 25px;
text-align: center;
font-family: Arial;
font-size: 14px
}
select {
appearance: none;
border: none;
}
select::-ms-expand {
display: none;
}
select {
width: 120px;
height: 25px;
padding-left: 5px;
color: #000000;
font-family: 'Arial', sans-serif;
font-size: 14px;
cursor: pointer;
border-style: solid
border-color: #ddcb07
}
.titulierung {
color:white;
font-family:arial;
font-weight:bold;
}
.ausgabe {
width: 2600px;
display: inline-block;
font-family: Arial;
color: #ffffff;
font-size:14px;
}
.anhangsel {
font-family: Arial;
color: #ffffff;
font-size:14px;
}
.ausgabe2 {
font-family: Arial;
font-size:14px;
}
button {
width:100px;
height:30px;
}
button {
background-color: #ddca07; /* Green */
border: none;
color: white;
height:30px;
width:120px;
padding: 5px 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 20px;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
cursor: pointer;
}
button {
background-color: black;
color: white;
border: 1px solid #ddca07;
width:150px;
height:30px;
font-size: 16px;
font-style:bold;
}
button:hover {
background-color: #ddca07;
color: black;
}
.angabe {
color:#ddca07;
font-family: Arial;
font-size:14px;
width:100%;
}
.angabe ~ span{
float:right;
}
.cont0 {
width:383px;
color:#ddca07;
text-indent:5px;
}
.cont1 ,.cont2 {
color:#ddca07;
}
hr {
width:383px;
border: 1px solid #ddca07;
}
.cont3 {
display:inline-block;
width:120px;
color:#ddca07;
}
</style>
<body style="background-color:#000000" >
<div class="container" >
<div class="containerlinks" >
<div class="containerlinksrahmen">
<form>
<h3 class="titulierung" >Dein Grundbedarf</h3>
<div class="line"><label class="ersteslabel" for="geschlecht" id="geschlecht">Geschlecht</label>
<select name="geschlecht" size="1" id="geschlecht2">
<option value="1"> Männlich </option>
<option value="2"> Weiblich </option>
</select></div>
<div class="line"><label class="ersteslabel" for="groesse" id="groesse">Grösse</label>
<input name="groesse" type="number" id="groesse2" placeholder="180"> cm</div>
<div class="line"><label class="ersteslabel" for="gewicht" id="gewicht">Gewicht</label>
<input name="gewicht" type="number" id="gewicht2" placeholder="80"> kg</div>
<div class="line"><label class="ersteslabel" for="alter" id="alter">Alter</label>
<input name="alter" type="number" id="alter2" placeholder="25"> Jahre</div>
<div class="line"><label class="ersteslabel" for="zielziel" id="zielziel">Ziel</label>
<select name="zielziel" size="1" id="zielziel2">
<option value="0"> Gewicht halten </option>
<option value="-400"> Abnehmen </option>
<option value="300"> Zunehmen </option>
</select></div>
<div class="line"><label class="ersteslabel" for="weise2" id="weise">Ernährungsweise</label>
<select name="weise" size="1" id="weise2">
<option value="alles"> Allesesser/in </option>
<option value="veget"> Vegetarier/in </option>
<option value="vegan"> Veganer/in </option>
</select></div>
<hr align="left" >
<div class="cont1" >
<div class="cont2" ><span class="angabe" >Grundumsatz: </span></div><div class="cont3"> <span id="GU1" class="ausgabe2" ></span></div>
</div>
</form>
</div>
</div>
<div class="containerrechts" >
<div class="containerrechtsrahmen">
<form>
<p class="titulierung" >Deine Aktivität</p>
<p><label class="zweiteslabel" for="akt1" id="akt1">Schlaf</label>
<input class="sport" name="akt1" type="number" id="akti1" value="8.0" step="0.5" > <span class="anhangsel" > h</span></p>
<p><label class="zweiteslabel" for="akt2" id="akt2">Sitzen, Autofahren, Lesen, Fernsehen</label>
<input class="sport" name="akt2" type="number" id="akti2" value="8.0" step="0.5"> <span class="anhangsel" > h</span></p>
<p><label class="zweiteslabel" for="akt3" id="akt3">Langsam Gehen, leichte Verrichtungen</label>
<input class="sport" name="akt3" type="number" id="akti3" value="5.0" step="0.5"> <span class="anhangsel" > h</span></p>
<p><label class="zweiteslabel" for="akt4" id="akt4">Zügig Gehen, körperliche Arbeit</label>
<input class="sport" name="akt4" type="number" id="akti4" value="3.0" step="0.5"> <span class="anhangsel" > h</span></p>
<p><label class="zweiteslabel" for="akt5" id="akt5">Schwerarbeit</label>
<input class="sport" name="akt5" type="number" id="akti5" value="0.0" step="0.0"> <span class="anhangsel" > h</span></p>
<p><label class="zweiteslabel" for="akt6" id="akt6">Sport (pro Woche)</label>
<input class="sport" name="akt6" type="number" id="akti6" value="0.0" step="0.0"> <span class="anhangsel" > h</span></p>
<hr align="left" >
<div class="cont1" >
<div class="cont2" >
<span class="angabe" >Total Stunden (ohne Sport): </span>
<span id="TH1" for="TH1" class="ausgabe2" ></span>
</div>
<div class="cont2">
<span class="angabe" >Durchschnittliche Aktivität pro Tag: </span>
<span id="AK1" for="AK1" class="ausgabe2" ></span>
</div>
<div class="cont2" >
<span class="angabe" >Kalorienverbrauch: </span>
<span id="KV1" for="KV1" class="ausgabe2" ></span>
</div>
<div class="cont2" >
<span class="angabe" >Zielzufuhr: </span>
<span id="ZZ1" for="ZZ1" class="ausgabe2" ></span>
</div>
</div>
<hr align="left" >
</form>
</div>
</div>
<div class="btncont">
<div class="btnareacontainer">
<div class="btn1">
<button type="button" id="btn">Berechnen</button>
</div>
<div class="btnabstand"></div>
<div class="btn2" id="btn2cont">
<button type="button" id="btn2">Plan holen</button>
</div>
</div>
</div>
<div id="outiputi"></div>
</div>
<script>
var zielzufuhr,out;
document.getElementById('btn').addEventListener('click',function(){
berechnung();
})
document.getElementById('btn2').addEventListener('click',function(){
holeplan()
})
function berechnung() {
var plus=0;
var groesse = parseInt(document.getElementById('groesse2').value);
var gewicht = parseInt(document.getElementById('gewicht2').value);
var alter = parseInt(document.getElementById('gewicht2').value);
var geschlecht = document.getElementById('geschlecht2').value;
var ziele = parseInt(document.getElementById('zielziel2').value);
var sportts=['schlaf','sitzen','gehen1','gehen2','sport3','sport4'];
i=0;
document.querySelectorAll('.sport').forEach(function(el){
sportts[i]=el.value;
i++;
plus+=parseInt(el.value);
})
if(geschlecht == 1){
var grundumsatz = Math.round(66.47+(13.7*gewicht)+(5*groesse)-(6.8*alter));
}else{
var grundumsatz = Math.round(655.1+(9.6*gewicht)+(1.8*groesse)-(4.7*alter));
}
var dakt = Math.round((((sportts[0]*0.9)+(sportts[1]*1.2)+(sportts[2]*2.2)+(sportts[3]*3.3)+(sportts[4]*6.6))/plus)*1000) / 1000 ;
var verbrauch = Math.round((grundumsatz * dakt)+((sportts[5]*5)/7));
zielzufuhr=verbrauch + ziele;
if (isNaN(grundumsatz)) {
grundumsatz = "keine" ;
}
if (isNaN(verbrauch)) {
verbrauch = "keine" ;
}
if (isNaN(zielzufuhr)) {
zielzufuhr = "keine" ;
}
document.getElementById("TH1").innerHTML = plus + " h";
document.getElementById("GU1").innerHTML = grundumsatz + " kcal";
document.getElementById("AK1").innerHTML = dakt + " MET";
document.getElementById("KV1").innerHTML = verbrauch + " kcal";
document.getElementById("ZZ1").innerHTML = zielzufuhr + " kcal";
var zufuhrv = document.getElementById("ZZ1").innerHTML;
if(zufuhrv === "keine kcal") {
alert("Bitte alle Daten zu deinem Grundbedarf eingeben");
}else{
document.getElementById("btn2cont").style.display = "inline-block";
}
}
function holeplan() {
var zielzu=zielzufuhr;
var wei = document.getElementById('weise2').value;
var erg=[1500,1700,1900,2100,2300,2500,2700,2900,3100,3300,3500,3700];
for(g=0;g<14;g++){
if(zielzu > erg[g] && zielzu < erg[g+1]){
out=erg[g]+' bis '+erg[g+1]+' und '+wei;
}
}
if(zielzu > 3700 || zielzu < 1500){
out="Keine Pläne vorhanden";
}
document.getElementById("outiputi").innerHTML=out;
}
/*
//var geschl1 = (geschlecht === '2') ? 655.1 : 66.47 ;
//var geschl2 = (geschlecht === '2') ? 9.6 : 13.7 ;
//var geschl3 = (geschlecht === '2') ? 1.8 : 5 ;
//var geschl4 = (geschlecht === '2') ? 4.7 : 6.8 ;
//timetimer();// (schlaf + sitzen + gehen1 + gehen2 + sport3);
var dakt = Math.round((((schlaf*0.9)+(sitzen*1.2)+(gehen1*2.2)+(gehen2*3.3)+(sport3*6.6))/totalstunden)*1000) / 1000 ;
var verbrauch = Math.round((grundumsatz * dakt)+((sport4*5)/7));
//}
function timetimer() {
var plus=0;
document.querySelectorAll('.sport').forEach(function(el){
plus+=parseInt(el.value);
})
console.log(plus)
return plus;
var schlaf10 = parseInt(document.getElementById('akti1').value);
var sitzen10 = parseInt(document.getElementById('akti2').value);
var gehen110 = parseInt(document.getElementById('akti3').value);
var gehen210 = parseInt(document.getElementById('akti4').value);
var sport310 = parseInt(document.getElementById('akti5').value);
var sport410 = parseInt(document.getElementById('akti6').value);
var totalitat = (schlaf10 + sitzen10 + gehen110 + gehen210 + sport310);
document.getElementById("TH1").innerHTML = totalitat + " h";
// var grundumsatz = geschlecht === 1 ?
// Math.round(66.47 + (13.7 * gewicht) + (5 * groesse) - (6.8 * alter)) :
// Math.round(655.1 + (9.6 * gewicht) + (1.8 * groesse) - (4.7 * alter));
// var verbrauch = Math.round((grundumsatz * dakt)+((sport4*5)/7));
// var schlaf = parseInt(document.getElementById('akti1').value);
// var sitzen = parseInt(document.getElementById('akti2').value);
// var gehen1 = parseInt(document.getElementById('akti3').value);
// var gehen2 = parseInt(document.getElementById('akti4').value);
// var sport3 = parseInt(document.getElementById('akti5').value);
// var sport4 = parseInt(document.getElementById('akti6').value);
var grundum;
var gr = parseInt(document.getElementById('groesse2').value);
var ge = parseInt(document.getElementById('gewicht2').value);
var al = parseInt(document.getElementById('alter').value);
var geschlecht = parseInt(document.getElementById('geschlecht2').value);
var ge1 = (geschlecht === '2') ? 655.1 : 66.47 ;
var ge2 = (geschlecht === '2') ? 9.6 : 13.7 ;
var ge3 = (geschlecht === '2') ? 1.8 : 5 ;
var gel4 = (geschlecht === '2') ? 4.7 : 6.8 ;
var zi = parseInt(document.getElementById('zielziel2').value);
var wei = document.getElementById('weise2').value;
var schl = parseInt(document.getElementById('akti1').value);
var sitz = parseInt(document.getElementById('akti2').value);
var geh1 = parseInt(document.getElementById('akti3').value);
var geh2 = parseInt(document.getElementById('akti4').value);
var spo3 = parseInt(document.getElementById('akti5').value);
var spo4 = parseInt(document.getElementById('akti6').value);
var grundumm = Math.round(66.47 + (13.7 * ge) + (5 * gr) - (6.8 * al));
var grundumw = Math.round(655.1 + (9.6 * ge) + (1.8 * gr) - (4.7 * al));
var totalstd = (schl + sitz + geh1 + geh2 + spo3);
var daktiv = Math.round((((schl*0.9)+(sitz*1.2)+(geh1*2.2)+(geh2*3.3)+(spo3*6.6))/totalstd)*1000) / 1000 ;
if(ge === 1){
grundum =Math.round(66.47 + (13.7 * ge) + (5 * gr) - (6.8 * al)) ;
}else{
grundum =Math.round(655.1 + (9.6 * ge) + (1.8 * gr) - (4.7 * al));
}
var verbr = Math.round((grundum * daktiv)+((spo4*5)/7));
console.log(verbr)
var zielzu = verbr + zi;
console.log(zielzu+''+wei)
var out;
if(zielzu<=1499){
// alert('Deine Angaben sind zu klein, Bastis eingabe');
return
}
*/
/*
if(wei=="alles"){
if(zielzu > 1500 && zielzu < 1700){
out="1500 bis 1700 und Allesesser";
}else if(zielzu > 1700 && zielzu < 1900){
out="1701 bis 1900 und Allesesser";
}else if(zielzu > 1900 && zielzu < 2100){
out="1901 bis 2100 und Allesesser";
}else if(zielzu > 2100 && zielzu < 2300){
out="2101 bis 2300 und Allesesser";
}else if(zielzu > 2300 && zielzu < 2500){
out="2301 bis 2500 und Allesesser";
}else if(zielzu > 2500 && zielzu < 2700){
out="2501 bis 2700 und Allesesser";
}else if(zielzu > 2700 && zielzu < 2900){
out="2701 bis 2900 und Allesesser";
}else if(zielzu > 2900 && zielzu < 3100){
out="2901 bis 3100 und Allesesser";
}else if(zielzu > 3100 && zielzu < 3300){
out="3101 bis 3300 und Allesesser";
}else if(zielzu > 3300 && zielzu < 3500){
out="3301 bis 3500 und Allesesser";
}else if(zielzu > 3500 && zielzu < 3700){
out="3501 bis 3700 und Allesesser";
}
}else if(wei=="veget"){
if(zielzu > 1500 && zielzu < 1700){
out="1500 bis 1700 und Vegetarier/in";
}else if(zielzu > 1700 && zielzu < 1900){
out="1701 bis 1900 und Vegetarier/in";
}else if(zielzu > 1900 && zielzu < 2100){
out="1901 bis 2100 und Vegetarier/in";
}else if(zielzu > 2100 && zielzu < 2300){
out="2101 bis 2300 und Vegetarier/in";
}else if(zielzu > 2300 && zielzu < 2500){
out="2301 bis 2500 und Vegetarier/in";
}else if(zielzu > 2500 && zielzu < 2700){
out="2501 bis 2700 und Vegetarier/in";
}else if(zielzu > 2700 && zielzu < 2900){
out="2701 bis 2900 und Vegetarier/in";
}else if(zielzu > 2900 && zielzu < 3100){
out="2901 bis 3100 und Vegetarier/in";
}else if(zielzu > 3100 && zielzu < 3300){
out="3101 bis 3300 und Vegetarier/in";
}else if(zielzu > 3300 && zielzu < 3500){
out="3301 bis 3500 und Vegetarier/in";
}else if(zielzu > 3500 && zielzu < 3700){
out="3501 bis 3700 und Vegetarier/in";
}
}else if(wei=="vegan"){
if(zielzu > 1500 && zielzu < 1700){
out="1500 bis 1700 und Veganer/in";
}else if(zielzu > 1700 && zielzu < 1900){
out="1701 bis 1900 und Veganer/in";
}else if(zielzu > 1900 && zielzu < 2100){
out="1901 bis 2100 und Veganer/in";
}else if(zielzu > 2100 && zielzu < 2300){
out="2101 bis 2300 und Veganer/in";
}else if(zielzu > 2300 && zielzu < 2500){
out="2301 bis 2500 und Veganer/in";
}else if(zielzu > 2500 && zielzu < 2700){
out="2501 bis 2700 und Veganer/in";
}else if(zielzu > 2700 && zielzu < 2900){
out="2701 bis 2900 und Veganer/in";
}else if(zielzu > 2900 && zielzu < 3100){
out="2901 bis 3100 und Veganer/in";
}else if(zielzu > 3100 && zielzu < 3300){
out="3101 bis 3300 und Veganer/in";
}else if(zielzu > 3300 && zielzu < 3500){
out= "3301 bis 3500 und Veganer/in";
}else if(zielzu > 3500 && zielzu < 3700){
out="3501 bis 3700 und Veganer/in";
}
}else{
out="Keine Pläne vorhanden";
}
*/
</script>
</body>