JavaScript Removechild Array

Question

Das sieht einfach genug aus, aber ich kann es einfach nicht zum Laufen bringen. Ich könnte DOM -Elemente hinzufügen, aber ich kann sie einfach nicht entfernen, wenn ich ein Array benutze.

<script language="javascript">
fields = 0;
count = 0;
function addInput() {
  if (fields != 10) {
      var htmlText =  "<input type='search' value='' name='field[]' />";
      var remButton = "<input type='button' value='del' onclick='remove()' />";
      var newElement = document.createElement('div');

      newElement.id = 'SomeID'+fields; 
      newElement.innerHTML = htmlText + remButton + newElement.id;

      var fieldsArea = document.getElementById('text');
      fieldsArea.appendChild(newElement);

      fields += 1;
  } else {
     ...
  }
count++;
}

// NEED HELP FROM HERE PLEASE
// You don't need to Loop, just get the button's id and remove that entire 'SomeID'


function remove() {
  fieldsArea = document.getElementById('text');


  fieldsArea.removeChild(SomeID1);   <-----------------------THIS WORKS!
  fieldsArea.removeChild(SomeID+count); <------------------THIS JUST WOULDN'T

  count--;
}
</script>

In der Funktion entfernen einige Werke ein paar Werke und löschen das erste hinzugefügte Element, aber wenn ich versuche, eine "Zählung" zu verwenden, kann ich meine "Elemente" einfach nicht löschen.

Jede Hilfe wäre am meisten geschätzt.

Vielen Dank!

Answer 1

Sie müssen zuerst einen Hinweis auf das Element erhalten. Derzeit passieren Sie eine undefinierte Variable SomeID zur Funktion.

Z.B:

var element = document.getElementById('SomeID' + fields);
// or starting by zero: var element = document.getElementById('SomeID0');
element.parentNode.removeChild(element);

Wenn Sie das entfernen möchten div Für die auf die Schaltfläche geklickt wurde, müssen Sie einen Verweis auf die entsprechenden übergeben div zum remove Funktion.

'<input type="button" value="del" onclick="remove(this.parentNode)" />';

this bezieht sich auf die Schaltfläche und wie es ein Kind der ist div, this.parentNode bezieht sich darauf div.

Sie müssen auch Ihre Funktion ändern, um das Element zu akzeptieren, das entfernt werden sollte:

function remove(element) {
  element.parentNode.removeChild(element);   
  count--;
}

Sie müssen wahrscheinlich auch aktualisieren fields, aber ich bin mir nicht sicher, wie Ihr Code funktionieren soll.

---

Wenn Sie alle entfernen möchten, müssen Sie schleifen:

for(;fields--;) {
   var element = document.getElementById('SomeID' + fields);
   element.parentNode.removeChild(element);
}

Schauen Sie sich auch das an die Dokumentation von removeChild.

Answer 2

Das removeChild Benötigt einen Knoten (DOM -Element) als Parameter. In diesem Fall

fieldsArea.removeChild(SomeID+count);

Sie können zum Beispiel den Knoten auf diese Weise bestehen

fieldsArea.removeChild(document.getElementById('SomeID'+count));