1UnitedPower: mit Javascript einen Iframe erzeugen

Beitrag lesen

Meine Herren!

da ich das "Keyboard" standardmäßig ausgeblendet habe (kein Touchdisplay), und auch mehr als ein Eingabefeld pro Seite haben könnte habe ich nachfolgendes Programm geschrieben.

Dein bisheriger Ansatz sieht also pro Eingabe-Feld eine eigene Tastatur vor. Es wäre wesentlich schöner, wenn du mit ein und der selben Tastatur mehrere Eingabefelder ansteuern könntest. Denk mal drüber nach.

Problem:
Wenn ich in den Funktionen die "id" des Textfeldes (input) fest eingebe, dann funktioniert alles. Wenn ich die "id" als Variable übergebe kommt die Fehlermeldung im debugger "ReferenceError: idtextfeld is not defined"

function open_keyboard(idtextfeld, idkeyboard)
{
document.getElementById(idkeyboard).innerHTML = "<input type="button" id="t1" class="tasten" value="1" onclick="writeText(this.id, idtextfeld);">";
}

  
Ich habe den Code mal auf das Wesentliche gekürzt.  
  
`idtextfeld`{:.language-javascript} ist ein Parameter der Funktion `open_keyboard`{:.language-javascript}. Dieser Parameter ist nur im Gültigkeitsbereich dieser Funktion ansprechbar. Wenn das Eingabefeld nun in das HTML eingefügt wird, hat der JavaScript-Code innerhalb des onclick-Attributs keinen Zugriff auf diesen Gültigkeitsbereich.  
  
Mit anderen Worten, das aus oben stehenden JS-Code resultierende HTML sieht wie folgt aus:  
  
`<input type="button" id="t1" class="tasten" value="1" onclick="writeText(this.id, idtextfeld);">`{:.language-html}  
  
`idtextfeld`{:.language-javascript} ist an dieser Stelle eine unbekannte Variable.  
  
Was du vermutlich erwartet hast, sollte so aussehen:  
  
`<input type="button" id="t1" class="tasten" value="1" onclick="writeText(this.id, 'textfeld');">`{:.language-html}  
  
Das erreichst mit folgendem Schnipsel:  
  
~~~javascript
function open_keyboard(idtextfeld, idkeyboard)  
{  
document.getElementById(idkeyboard).innerHTML = "<input type=\"button\" id=\"t1\" class=\"tasten\" value=\"1\" onclick=\"writeText(this.id, '" + idtextfeld + "');\">";  
}  

Beachte, dass du den gleichen Fehler noch an vielen anderen Stellen machst.

Ein weiterer Nachteil deines Ansatzes ist, dass du selbst-modifizierenden Code erzeugst. Das möchte man im Allgemeinen vermeiden, weil es sehr schlecht wartbar ist und eben zu genau solchen Fehlern führt, wie du ihn jetzt hast. Umgehen kannst du das, indem du dich in die verschiedenen Möglichkeiten der Ereignis-Behandlung von JavaScript einliest und dich in objektorientierte Programmierung einarbeitest. Das sind aber zwei sehr komplexe Themenbereiche, die man nicht von heute auf morgen erlernt.

Bin für jeden Tip oder aber auch Verbesserung dankbar.

Das scheint mir bisher leider nicht so, du gehst fast gar nicht auf die Antworten der Helfer ein, sondern stellst nur weiter Fragen. Wenn du was an einer Antwort nicht verstehst, versuche dich mit dem Thema zu beschäftigen, wenn du es dann immer noch nicht verstehst, frage einfach nochmal konkret nach, was der Antwortende gemeint hat.