Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Javascript: Elemente im Text erzeugen

Empfohlene Antworten

Hallo,

ich möchte folgendes realisieren:

in einem Formular möchte ich per Klick auf einen Button ein neues Element erzeugen.

z. B. habe ich ein Formular mit 3 Textfelder. Irgendwo ist ein Button. Wenn nun der Button gedrückt wird, soll unter dem 3 Feld ein viertes Feld erscheinen. Drückt man den Button nochmals ein fünftes usw.

[button Feld erzeugen]

Feld 1 [_______________] also <input type=text name=feld1><br>

Feld 2 [_______________] also <input type=text name=feld2><br>

Feld 3 [_______________] also <input type=text name=feld3><br>

Feld 4 [_______________] ereugtes Feld 4 (also nicht im Quelltext zu sehen)

Feld 5 [_______________] ereugtes Feld 5 (also nicht im Quelltext zu sehen)

ich habe dazu eine kleine Funktion gebastelt, die per Event "onclick" aufgerufen wird, wenn der Button geklickt wird.

also:

<input type=button value="erzeuge feld" onclick="javascript:felderzeugen();">

leider erzeugt mir die funktion eine komplett neue seite, wo dann nur das feld oben steht und alles andere weg ist. ich möchte aber nur, dass das feld an die Anderen angehängt wird. Wie mache ich das?

mit:

document.write("<input type=text name=feld>");

geht es nicht.

danke für Eure Hilfe.

Geht IMHO nicht :(, wenn dann höchstens mit ner add()-Methode. Hab aber nichts passendes bei SelfHTML gefunden.

Ich würde die Sache an deiner Stelle mit ner serverseitigen Scriptsprache machen (PHP,Perl,JSP,ASP etc.).

So geht es


<HTML>

<HEAD>

<TITLE>Test</TITLE>

<script language="JavaScript">

function NewField() {

  var NewInput = document.createElement("input");

  var NewBR = document.createElement("br");

  var Ausgabebereich = document.getElementById("dummyFormID");

  Ausgabebereich.appendChild(NewInput);

  Ausgabebereich.appendChild(NewBR);

}

</script>

</HEAD>

<BODY>

<form name="dummyForm" id="dummyFormID">

  <input type="button" name="btnNeu" value="neues Feld erstellen" onclick="NewField();"><br><br>

  <input type="text" name="text1"><br>

  <input type="text" name="text2"><br>

  <input type="text" name="text3"><br>

</form>

</BODY>

</HTML>

ja prima! exakt, das was ich gebraucht habe! :uli

was mir jetzt noch nicht ganz klar ist, wie sind die felder benannt?? klar! die ersten 3 felder sind mit text1, text2, text3 benannt. ich muss die felder ja dann in einem script (in diesem fall php), welches die daten aufnimmt, identifizieren können. dies möchte ich das mittels einem array lösen, da es anders sowieso nicht geht.

also

text[1]

text[2]

text[3]

text[4]

usw.


<HTML>

<HEAD>

<TITLE>Test</TITLE>

<script language="JavaScript">

function NewField() {

  var NewInput = document.createElement("input");

  var NewBR = document.createElement("br");

  var Ausgabebereich = document.getElementById("dummyFormID");

  NewInput.name = "test[]";

  Ausgabebereich.appendChild(NewInput);

  Ausgabebereich.appendChild(NewBR);

}

</script>

</HEAD>

<BODY>

<form name="dummyForm" id="dummyFormID">

  <input type="button" name="btnNeu" value="neues Feld erstellen" onclick="NewField();"><br><br>

  <input type="text" name="text[]"><br>

  <input type="text" name="text[]"><br>

  <input type="text" name="text[]"><br>

</form>

</BODY>

</HTML>

achso.... na klar! da hätte ich auch selbst drauf kommen können! lange leitung heute! danke ;)

naja, WE steht vor der Tür :-)

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Konto

Navigation

Suchen

Suchen

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.