Autor |
Nachricht |
Zeussi
Threadersteller
Dabei seit: 13.07.2007
Ort: München - Freising
Alter: -
Geschlecht:
|
Verfasst Fr 07.09.2007 17:32
Titel [Javascript] Inputfelder hinzufügen / entfernen |
|
|
Hallo Freunde der Sonne,
ich versuche nun seit einigen Tagen mit Hilfe von selfHTML Inputfelder hinzuzufügen und wieder zu löschen. Bis jetzt habe ich es geschafft, dass über "getElementsByTagName" das der erste oder letzte Listenpunkt gelöscht wird mit lastchild und firstchild.
Was mein Problem ist:
1. Wie schaffe ich es, jeden einzelnen Listenpunkt anzusprechen?
2. Wie schaffe ich es, dass bei jedem hinzugefügten Input-Feld ein "entfernen-link" ala <a href="#" onclick="killli">kill</a> mit generiert wird?
Ich habe schon versucht, da ja bei "getElementsByTagName" das [0] das erste Array ist, zB 1 einzutragen und dann damit das zweite anzusprechen, aber es funktioniert nicht.
Auch ist bei der ByTagName-Methode nicht direkt eine ID angesprochen, deswegen habe ich versucht, zuerst die ID anzusprechen, aber auch dies klappt nicht.
Immer wenn ich denke, ich habe das Konzept geschnallt, merke ich, dass ich es anscheinend doch nicht verstehe. Ich bitte um eure Hilfe!
Der Code, der nicht geht:
Code:
Code: | <script type="text/javascript">
function addli() {
var li = document.createElement("li");
var input = document.createElement("input");
li.appendChild(input);
document.getElementById("bereich").appendChild(li);
}
function killli() {
var bereich = document.getElementsID("bereich").lastChild;
var knoten = bereich.getElementsByTagName("ul")[0].lastChild;
verschwunden = bereich.getElementsByTagName("ul")[0].removeChild(knoten);
}
</script>
<a href="javascript:addli()">add</a><br />
<ul style="list-style:none;" id="bereich" type="I" start="1">
<li><input type="text"> <a href="javascript:killli()">kick 1</a></li>
<li><input type="text"> <a href="javascript:killli()">kick 2</a></li>
<li><input type="text"> <a href="javascript:killli()">kick 3</a></li>
<li><input type="text"> <a href="javascript:killli()">kick 4</a></li>
<li><input type="text"> <a href="javascript:killli()">kick 5</a></li>
</ul> |
Liebe Grüße,
Stephan
Zuletzt bearbeitet von Zeussi am Fr 07.09.2007 17:33, insgesamt 1-mal bearbeitet
|
|
|
|
|
nomidi
Dabei seit: 07.09.2007
Ort: bei Bremen
Alter: 48
Geschlecht:
|
Verfasst Fr 07.09.2007 17:39
Titel
|
|
|
zähle alle Kinder von der ul und gehe durch ne for schleife.
|
|
|
|
|
Anzeige
|
|
|
Zeussi
Threadersteller
Dabei seit: 13.07.2007
Ort: München - Freising
Alter: -
Geschlecht:
|
Verfasst Fr 07.09.2007 17:50
Titel
|
|
|
Zählen?
mit length ?
Habe ich versucht, wollte es ausgeben, aber er zeigt mir nichts an.
Das war so:
anzahl = bereich.getElementByTagName("ul").childNodes.length;
|
|
|
|
|
nomidi
Dabei seit: 07.09.2007
Ort: bei Bremen
Alter: 48
Geschlecht:
|
Verfasst Fr 07.09.2007 18:01
Titel
|
|
|
wie sah denn deine for schleife aus ?
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
|
|
|
|
Zeussi
Threadersteller
Dabei seit: 13.07.2007
Ort: München - Freising
Alter: -
Geschlecht:
|
Verfasst Fr 07.09.2007 18:23
Titel
|
|
|
@m:
Das ist ein Script zum Hinzufügen, aber ich verstehe nicht, was es mir helfen sollte?
@ nomidi:
es war keine for-Schleife ehrlicherweiße, es war eine If-Abfrage
Code: | var counter = 0;
[...]
function[...]
[...]
if(counter < anzahl)
{
[...]
counter++
}
[...] |
Aber ich verstehe immer noch nicht, was mir auch das helfen sollte.
Als ich im Array ein weiteres Element aufrufen wollte, ging es ja schon nicht. Wieso sollte es dann bei einer Schleife gehen? Ich kenn mich ehrlich gesagt nicht so gut in Javascript aus, habs nur im Zusammenhang mit selfHTML getestet, das Script da oben geht ja auch nicht, und ich weiß nicht warum. Bin da eher der PHP-Mensch, steig die ganze Javascript-Gedanken ned so ;>
Zuletzt bearbeitet von Zeussi am Fr 07.09.2007 18:24, insgesamt 1-mal bearbeitet
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 07.09.2007 18:45
Titel
|
|
|
Zeussi hat geschrieben: | @m:
Das ist ein Script zum Hinzufügen, aber ich verstehe nicht, was es mir helfen sollte? |
Zum hinzufügen und entfernen von input Elementen und dass versuchst du doch
oder nicht? Aber dann habe ich dich wohl mißverstanden.
|
|
|
|
|
Zeussi
Threadersteller
Dabei seit: 13.07.2007
Ort: München - Freising
Alter: -
Geschlecht:
|
Verfasst Fr 07.09.2007 19:09
Titel
|
|
|
Ah, jetzt, hab deinen Beitrag erst gar nicht gesehen.
Er funktioniert wunderbar, nur habe ich da noch ein paar Fragen, da ich deinen Code nicht verstehe.
Auch wenn ich den Button durch einen Link ersetze geht nichts mehr.
<a href="#" onclick="clone_this(this)">erweitern</a>
Liegt wohl daran, dass bei this ein Formular-Objekt benötigt wird oder?
Deswegen wollt ich wissen, ob es möglich ist, ohne dieses this das ganze mit einem Link realisierbar ist?
Oder was übergibt denn dieses This? Versteh ich nicht :/
Der Code den ich von Dir habe:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>...</title>
<script type="text/javascript">
<!--
function clone_this(objButton)
{
var tmpNode = objButton.form.elements[0].parentNode.cloneNode(true);
tmpNode.getElementsByTagName('input')[1].style.display = 'inline';
var tmpElm = document.createElement('input');
tmpElm.type = objButton.form.elements[0].type;
tmpElm.name = objButton.form.elements[0].name;
tmpNode.replaceChild(tmpElm,tmpNode.getElementsByTagName('input')[0]);
objButton.form.insertBefore(tmpNode,objButton);
}
function remove_this(obj)
{
obj.form.removeChild(obj.parentNode);
}
//-->
</script>
</head>
<body>
<form>
<div>
<label>E-Mail: </label><input size="20" name="textfeldname[]" type="text" />
<input type="button" onclick="remove_this(this)" value="löschen" style="display:none">
</div>
<input value="noch eins" onclick="clone_this(this)" type="button" />
</form>
</body>
</html> |
Zuletzt bearbeitet von Zeussi am Fr 07.09.2007 20:08, insgesamt 1-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
[Javascript] Multiple form upload / input felder hinzufügen
Splines bei 3Ds Max hinzufügen
Freehand -Punkte hinzufügen
Zum Home-Bildschirm hinzufügen
[TYPO3] RTE - Schriftgröße 9 pt hinzufügen?
Soundkanal im director hinzufügen?
|
|