Diana: Problem Tabellenzellen per klick ID ausgeben

Ich habe eine Tabelle die dynamisch erstellt wird . nun soll dort auch jedes image das ich einfüge eine eindeutige Id bekommen , und über diese Id hänge ich dann einen onClick an . Leider funktioniert es nicht so ganz . Die Tabelle wird aufgebaut , das gif das ich überall einfüge ist sichtbar , und auch das onclick arbeitet ( nicht korrect leider ) Es giebt mir immer wenn ich auf eine der Images klicke die selbe Ausgabe per alert und zwar das höchst i und j also zb wenn ich 4 rows 4 cols habe 3I3 zB , egal auf welches image ich in der Tabelle klicke . Woran kann dies liegen ? giebt es eine Möglichkeit den dynamisch eingefügten code anzusehen ? Wenn ich auf quelltext gehe bekomme ich nur grundzustand vor dem einfügen angezeigt . Vielleicht kann mir ja jemand helfen , verzweifle langsam , dauernd 100 Sachen die nicht so arbeiten wie man es denkt und man findet in 50% der Fälle auch über google und co keine wirkliche Antwort . Bin für jegliche Hilfe dankbar . Hier der Code

var tr;
 var td;
 var imgmap;

function tabelleerstellen(){

var table = document.createElement("table");
 tablebody = document.createElement("tbody");
 table.appendChild(tablebody);

for(i=0;i<4;i++){
  tr = document.createElement('tr');
  tablebody.appendChild(tr);

for(j=0;j<4;j++){
   td = document.createElement('td');
   td.setAttribute("id",i+"_"+j);
   //td.appendChild(document.createTextNode("hi text"));// damit man was sieht

imgmap = document.createElement("img");
   imgmap.setAttribute("id", i+"I"+j)
        imgmap.src = "empty.gif"

imgmap.style.width = "40";
   imgmap.style.height = "40";

td.appendChild(imgmap);
   tr.appendChild(td);
  }
 }

document.getElementById("map").appendChild(table);

for(i=0;i<4;i++){

for(j=0;j<4;j++){
   document.getElementById(i+"I"+j).onclick = function() { tabellenausgabe(i+"I"+j); }
  }
 }
}

  1. Moin!

    for(i=0;i<4;i++){

    for(j=0;j<4;j++){
       document.getElementById(i+"I"+j).onclick = function() { tabellenausgabe(i+"I"+j); }
      }
    }
    }

    Ich nehme an, daß Dir die sogenannte "closure" da reinpfuscht. Der zugriff auf i und j beim Aufruf von "tabellenausgabe" erfolgt erst zu dem Zeitpunkt, zu dem der Handler läuft und nicht zu dem Zeitpunkt, zu dem Du die Funktion definierst.

    Statt daß Du auf i und j in der Funktion zugreifst, hol Dir doch lieber über "this" das id attribut.

    -- Skeeve

  2. Bist du sicher das du die ID überhaupt brauchst?
    Du machst das ganze nämlich sehr umständlich.

    imgmap = document.createElement("img");
       imgmap.setAttribute("id", i+"I"+j)
            imgmap.src = "empty.gif"

    imgmap.style.width = "40";
       imgmap.style.height = "40";

    du könnste hier den Event einfügen:

    imgmap.onclick = function()
    {
       alert(this.src);
    }
    und hast in der Funktion zugriff auf das Element per this.

    Struppi.

    --
    Javascript ist toll (Perl auch!)