✔ Probleme mit addEventListener

[Nitrama]

Hallo,

ich habe ein Problem mit .addEventListener in Javascript.
Es Funktioniert immer blos das zuletzt erstellte Event.

i ist in einer for Schleife und wird hochgezählt.

 var text= '<div class="ListStyle" id="SubList'+i+'" ><img class="ListImg" src="'+data.results[i].artworkUrl100+'"><div class="ListDescription"><h4>'+titel+'</h4></div></div>';

document.getElementById("ListStyle").innerHTML += text;

  document.getElementById('SubList'+i).addEventListener('click', function(){ submanage('add' , titel1 , feedUrl)});

Ich bekomme weder in Firefox noch in Chrome eine Fehlermeldung ausgespuckt.
Vllt kann mir jemand helfen

Gruß Nitrama

 

[ComFreek]

Ich vermute, dass du auf folgendes bekanntes "Problem" gestoßen bist: http://stackoverflow.com/q/1451009/603003

Sofern titel1 und feedUrl sich in der for-Loop ändern, musst du den Aufruf von addEventListener() in einen Closure packen.

 

[Nitrama]

Ich danke dir.

Ich verstehe zwar die Funktion nicht aber es Funktioniert jetzt.

 var text= '<img class="ListImg" src="'+data.results[i].artworkUrl100+'"><div class="ListDescription"><h4>'+titel+'</h4></div>';

var mydiv = document.createElement("div");
    mydiv.className = "ListStyle";
    mydiv.innerHTML = text;
    mydiv.onclick = function (num , num2 , num3) {
            return function () {
                submanage(num , num2 , num3);
            };
        }("add" , titel , feedUrl);
      
      
document.getElementById("ListStyle").appendChild (mydiv);

 

[ComFreek]

Es geht darum, dass die Referenzen auf die Variablen bei deinem ersten Code immer gleich blieben. Somit nehmen die zwei Variablen in jedem Schleifendurchlauf neue Werte an, bis sie mit den Werten des letzten Durchlaufs befüllt werden. Jeder Eventlistener, den du hinzugefügt hast, hält Referenzen auf diese Werte, sprich er arbeitet beim Aufruf auch nur mit den letzten Werten.