Löschen von parent-element mit javascript
Ich habe ein problem mit meinem javascript. Ich möchte eine Art to-do-Liste, aber ich kann nicht herausfinden, wie, um ein Element zu löschen.
Beim erstellen ein Element, fügt es zu der Liste mit der Schaltfläche "löschen", aber ich weiß nicht, was zu tun ist, für den Artikel zu löschen, selbst wenn Sie auf die Schaltfläche.
Habe ich diese auf die addItem-Funktion
var item = document.createElement("li");
item.innerHTML = itemText + "<button class='delete'>Delete item</button>";
list.appendChild(item);
Wäre und das ist die Funktion für das löschen den Artikel, aber ich weiß nicht, was man in ...
function deleteItem() {
}
- geben Sie einfach ein Ereignis-parameter innerhalb deleteItem(e) , nun weiter siehe e.target-element und führen Sie zum entfernen dieses element. Ich hoffe, das löst Ihr Problem. Dies versuchen. dh. Element hinzufügen.innerHTML = itemText + "<button class='löschen' onClick='deleteItem(e)" >Delete Element</button>";
- Ich fügte das, was Sie mir zu add auf die innerHTML, aber was soll ich schreiben, die genau auf die deleteItem(e) - Funktion? Ich bin nicht sehr gut mit javascript ..
- können Sie bitte teilen Sie einen Teil der Arbeit-code in Geige oder so etwas. ?
Du musst angemeldet sein, um einen Kommentar abzugeben.
Haben Sie ein paar Optionen:
Du könnte befestigen Sie es wie ein handler direkt auf den button, dann verwenden Sie
this.parentNode
Zugriff auf das übergeordnete element. Tatsächlich entfernen Sie es, würden Sie wahrscheinlich wollen zu gehen, einen Schritt weiter oben in der Hierarchie (DOM4 definiert eineremove
Methode, die auf Elementen, aber es kann keine Unterstützung für ältere Browser). Das würde dann so Aussehen:Statt von, dass, obwohl, ich verwenden würde, Ereignis-delegation: Haken
click
auf der Liste, und wenn das klicken ging durch eine dieser löschen-buttons, Griff es dann: Ihr code für das hinzufügen der Liste Element, und button wäre unverändert. In eine Platz, hätten Sie diese:sowie
deleteItem
würde wie folgt Aussehen:Hier ein live Beispiel #2:
JS:
HTML:
Müssen Sie das übergeordnete element ein übergeordnetes element mit
removeChild
.Vorausgesetzt
button
verweist auf das button-element:So machen Sie Ihre Schaltfläche anklickbar. Sie würde vielleicht etwas tun, wie
Edit:
Seit Samuel Liew wollte Sie mich hinzufügen, dass es so schlecht hier ist, wie Sie erhalten die
button
element aus dem Kontext desitem
(nach EinstellunginnerHTML
):Alles zusammen:
button
beziehen sich auf die Schaltfläche in Frage.button
element.Können Sie auch beziehen sich auf diese viel einfachere Lösung:
Zum Beispiel mit einer Bildergalerie;
//.................................................
Hoffe es hilft 🙂