Hallihallo,
heute mal ein jQuery/JS-Problem. Ich habe eine Liste, der ich per JS Einträge anfügen oder entfernen kann. Dies funktioniert soweit auch. Allerdings vielleicht eher zufällig? Ich scheine da wieder irgendwas komisches zusammengefuscht zu haben. Denn meine globale Zählervariable, mit der ich die Anzahl der Listenelemente direkt per Klick speichern will, zeigt mir, dass offenbar was schief läuft.
Das Zufügen und Hochzählen funktioniert tadellos. Das Entfernen des Listenelements erstmal auch, aber die Zählervariable spinnt. Ich vermute, das Problem liegt darin, dass ich bei jedem Zufügen die Funktion LinkRemove aufrufe. Je öfter ich das tue, also je mehr Elemente ich zufüge, umso mehr vermindert er dann auch die Zählervariable, je nachdem das wievielte Listenelement ich entferne. Wenn ich 5 Elemente zufüge und dann das erste der fünf Elemente lösche, springt die Zählervariable sofort von 5 auf 0, obwohl ja nur 1 Element entfernt wurde.
ICh habe jetzt stundenlang rumprobiert, aber mir fällt nichts mehr ein. Ich weiß nicht mal mehr genau, warum ich LinkRemove() nach jedem DOM-Zufügen aufrufen muss, es geht aber derzeit nur so. Wahrscheinlich damit die Funktion immer Zugriff auf den aktuellen DOM-Baum hat? Hm, ich bin gerade wieder ratlos.
Beste Grüße
Onkel Schnitzel
<button type="button" id="addLink">Link hinzufügen</button>
<ul>
<li>
<button type="button" class="removeLink"></button>
<input name="link[]">
<input name="linktext[]">
</li>
</ul>
var LINKS_ANZAHL = 0;
$(document).ready(function() {
LinkRemove ();
});
// DOM-Element hinzufügen und glob. Variable +=1
$('button#addLink').click(function() {
console.log('+');
LINKS_ANZAHL+=1;
// Listenelement hinzufügen .... (hier mal rausgenommen)
// Aufruf
LinkRemove();
});
// DOM-Element entfernen und glob. Variable -=1
var LinkRemove = function () {
$('button.removeLink').click(function() {
console.log('-');
LINKS_ANZAHL-=1;
// Listenelement entfernen => funktioniert
$(this).parent().remove();
});
}