Rolf B: In einer javascript schleife a_1 a_2 mit der Zählvariable verbinden a_ i

Beitrag lesen

Hallo Therry,

wir denken offenbar nicht entlang der gleichen Linien, denn ich erkenne deine Schwierigkeit nicht. Ich versuche nochmal, dein Problem mit meinen Worten darzustellen.

Wenn ich Dich richtig verstanden habe, möchtest Du dies

document.getElementById("a_1").value=document.rechner.e_1.valueAsNumber *12;
document.getElementById("a_2").value=document.rechner.e_2.valueAsNumber *12;
...
document.getElementById("a_9").value=document.rechner.e_9.valueAsNumber *12;
document.getElementById("a_10").value=document.rechner.e_10.valueAsNumber *12;

vermeiden und es mittels einer Schleife realisieren. Da, wo die Fragezeichen sind, weißt Du nicht, was Du machen sollst.

for (let i=1; i<=10; i++) {
   document.getElementById(???).value = document.rechner.***.valueAsNumber * 12;
}

Beim ersten Fragezeichen ist es einfach. Da wird eine Zeichenkette gebraucht, die aus "a_" und der Nummer besteht. Dafür kannst Du den + Operator verwenden, der addiert Zahlen oder hängt Zeichenketten aneinander, je nach dem, was Du ihm gibst. 2+2 ergibt 4, "2" + 2 ergibt "22" und "a_"+i ergibt beispielsweise "a_3". Achte auf die Anführungszeichen, Zahlen und Zeichenketten sind was unterschiedliches, auch wenn JavaScript eine Zahl bei Bedarf automatisch in eine Zeichenkette umwandelt.

Beim zweiten Fragezeichen musst Du deine Arbeitsweise ändern. document.rechner liefert Dir das HTMLFormElement-Objekt, das das <form name="rechner"> Element in JavaScript repräsentiert. In diesem Objekt gibt es für jedes Form-Element (input, button, etc), das ein id oder ein name Attribut hat, eine Eigenschaft dieses Namens. Ein <input type="number" id="e_1"> erzeugt auf dem HTMLFormElement Objekt eine Eigenschaft document.rechner.e_1.

Nun kennst Du aber den Namen der Eigenschaft zur Programmierzeit nicht. Du bestimmst ihn erst zur Laufzeit des Scripts und hast ihn in einer Variablen, die - sagenwirmal - id heißt. Aber: document.rechner.id sucht eine Eigenschaft mit Name "id", und nicht die Eigenschaft, deren Name in id steht. Dafür gibt es die Schreibweise mit eckigen Klammern: document.rechner[id] tut das, was Du brauchst: Es sucht in document.rechner eine Eigenschaft, deren Name in der Variablen id steht.

Du könntest die Fragezeichen also so füllen:

for (let i=1; i<=10; i++) {
   document.getElementById("a_"+i).value = document.rechner["e_"+i].valueAsNumber * 12;
}

Und dann bin ich noch einen Schritt weitergegangen und habe angemerkt, dass Du hier zwei verschiedene Wege zum gleichen Ziel gehst. document.getElementById(id) sucht auf der ganzen Seite ein HTML Element mit dieser id. document.rechner[id] tut etwas ähnliches, nur begrenzt auf das rechner-Form. Es ist - denke ich - schlechter Stil, so etwas zu mischen. Deine Ausgabe-Elemente sind ebenfalls inputs im Form, es könnte also einheitlich so aussehen

for (let i=1; i<=10; i++) {
   document.rechner["a_"+i].value = document.rechner["e_"+i].valueAsNumber * 12;
}

Weil Du ohnehin die Aufgabe hast, Ein- und Ausgabefelder über ihre Feldnummer anzusprechen, habe ich Dir eine Funktion vorgeschlagen, die das Heraussuchen des Feldes zentral durchführt. Das ist getField.

for (let i=1; i<=10; i++) {
   getField("a", i).value = getField("e", i).valueAsNumber * 12;
}

Was Du davon nun verwenden willst, sei Dir überlassen.

Rolf

--
sumpsi - posui - obstruxi