Hinzufügen und Entfernen von Boxen mit Javascript

Ich habe zwei Textfelder und zwei Schaltflächen namens hinzufügen und entfernen. Die Anforderung besteht darin, zu den aktuellen Feldern weitere Felder hinzuzufügen. Es ist mir irgendwie gelungen, Boxen hinzuzufügen, aber die Anforderung, die Boxen zu entfernen, funktioniert nicht. Bitte helfen Sie, warum dieser Code nicht funktioniert und schlagen Sie, wenn möglich, eine funktionierende Lösung vor.Hinzufügen und Entfernen von Boxen mit Javascript

function addFunction(){ 
 
    var element = document.createElement("input"); 
 
    var parent = document.getElementById("form1"); 
 
    parent.appendChild(element); 
 
} 
 

 
function removeFunction(){ 
 
    var child = document.getElementsByTagName("input"); 
 
    var parent = document.getElementById("form1"); 
 

 
    for (var i = 0; i > child.length; i++) { 
 
    parent.removeChild(child[i]); 
 
    }; 
 
}

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 
    <form id="form1" style="margin-left: 40%; margin-top: 100px;"> 
 
     <input type="text" id="one"><br><br><br> 
 
     <input type="text" id="two"><br> 
 
     <p id ="demo"> </p> 
 
    </form> 
 
    <button style="margin-left: 40%;" type="button" value="ADD" id="addButton" onclick="addFunction()">ADD</button> 
 
    <button style="margin-left:50px;" type="button" value="REMOVE" id="removeButton" onclick="removeFunction()">REMOVE</button> 
 
    </body> 
 
</html>

Quelle

2017-04-20 Daredevil

müssen Sie den Knoten "klonen" vor dem Anhängen der gleichen https://developer.mozilla.org/en/docs/Web/API/Node/cloneNode – gurvinder372

for (var i = 0; i < child.length; i++) { 
     parent.removeChild(child[i]); 
    };

Sie haben in Ihrer for-Schleife falsch Zustand bekommen. Ihre i ist immer 0 beim Start und ist kleiner als die Länge des Arrays mit Knotenelementen, so dass die Schleife nicht gestartet werden kann. Ps.s. und Sie brauchen nicht var i bevor es

Quelle

2017-04-20 08:01:49 Brissy

ich war so dumm .. Danke für die Erklärung und Hilfe ... – Daredevil

Ihre for-Schleife ist falsch:

 for (var i = 0; i > child.length; i++) { 
      parent.removeChild(child[i]); 
     };

Sie müssen sich ändern ">" auf "<"

Quelle

2017-04-20 08:02:02 kaljak

Yeah .. Jetzt funktioniert es .. ich war so dumm .. Danke für die Hilfe ... – Daredevil

Ersetzen Sie Ihre> Bedingung in der for-Schleife mit <. Sie möchten, dass die for-Schleife ausgeführt wird, bis sie child.length erreicht.

Quelle

2017-04-20 08:04:47 Felix

Ja .. Jetzt funktioniert es .. ich war so dumm .. Danke für die Hilfe ... – Daredevil

Abstimmen und markieren Sie die akzeptierte Antwort, wenn dies für Sie nützlich war. – Felix

Ja, ich habe es getan, aber es sagt, dass meine Stimmen hoch sind, aber es wird nicht öffentlich gezeigt werden, da ich weniger als 15 Ruf .. – Daredevil

Hinzufügen und Entfernen von Boxen mit Javascript

Antwort

Verwandte Themen