variablem Button eine Funktion zuweisen
Hallo zusammen,
ich habe leider schon wieder ein Problem bei dem ich leider hänge, vermutlich aber wieder nur einen Denkfehler habe. ;)
Ich habe eine Telefonliste mit Mailadressen, welche ich mit einem Button in ein separates div kopiere. Nun soll die Möglichkeit bestehen, die jeweiligen gewählten Adressen auch wieder aus dem div zu löschen. Dafür gebe ich jedem Adresse einen Button als child mit, welcher dann wieder auf eine Funktion zugreifen soll.
Prinzipiell funktioniert das auch, allerdings immer nur mit der letzten kopierten Adresse. Die Adressen und den Button füge ich so in das div ein:
Ich weiß, zumindest mit dem einfügen des <p> habe ich es mir einfach gemacht, aber das kann ja nicht der Grund sein warum die Funktion immer nur beim zuletzt zugefügtem Button überthaupt anspringt? In der Funktion 'MailLoeschen' wird bisher nur ein Alert ausgelöst, daran liegt es also nicht.
Die Funktion nutze ich fast identisch noch einmal an anderer Stelle, und hier startet jeder Button die gewünschte Funktion.
Hofffe habe es verständlich geschrieben?
Besten Dank schon einmal für kreative Vorschläge...
Kommentar abgeben zu diesen Beitrag/Code ?document.getElementById('MailErgebnisse').innerHTML=document.getElementById('MailErgebnisse').innerHTML + ''+this.value+'
';
var loeschKnopf=document.createElement('Button');
loeschKnopf.innerHTML='X';
loeschKnopf.id='loesch'+this.value;
loeschKnopf.value='loesch'+this.value;
loeschKnopf.className='LöschKnopf';
loeschKnopf.addEventListener('click', MailLoeschen);
document.getElementById(this.value).appendChild(loeschKnopf);Dann hier klicken
Der hier verwendete Code
<style>
#MailErgebnisse{
width:100%;
min-height:200px;
border:1px solid red;
}
</style>
<div id="MailErgebnisse"></div>
<input type="button" id="dazu" value="erzeuge Mail">
<p id="info"></p>
<script>
document.getElementById('MailErgebnisse');
var d=0;
mail=document.getElementById('dazu');
mail.addEventListener('click',function(){
d++;
var loeschKnopf=document.createElement('div');
loeschKnopf.id="box"+d+"";
loeschKnopf.innerHTML='<span id="mail'+d+'" >Bla bla '+d+' <button class="kill">X</button></span><br>';
loeschKnopf.className='LoeschKnopf';
document.getElementById('MailErgebnisse').appendChild(loeschKnopf);
loeschKnopf.addEventListener('click', function(){
raus=this.remove();
inf=document.getElementById('info');
inf.innerHTML='Eintrag '+this.id+' wurde gelöscht';
});
})
</script>