Übergeben von Bildarray-Werten und Ändern der Bildquelle durch Klicken

OK, also endlich ist der Penny auf das Klickproblem gefallen, das ich hier hatteHänge dynamisches div nur einmal an und ein JSFiddle-Problem. Der Code zeigt dem Benutzer nun eine Auswahl an Bildern, die einmal pro angeklicktem Knoten angezeigt werden. Puh.

Nun aber meineimg.src=e.target.src Zeile hat Probleme beim Zugriff auf die anderen Bilder im Array. Nur das letzte Bild im Array wird der Tabelle hinzugefügt. Ich denke das liegt daran dasallImages.onclick Event sollte in der Schleife sein?

Ich habe das versucht und dannimg wird als undefiniert angezeigt. Ich vermute, das liegt daran, dass die Schleife (und damit die Funktion) vorher läuftvar img wird deklariert? Ich denke, es ist ein Problem mit der Reihenfolge der Dinge.

Alle Hilfe dankbar.

var makeChart = function () {
    var table = document.createElement('table'),
    taskName = document.getElementById('taskname').value,
    header = document.createElement('th'),
    numDays = document.getElementById('days').value, //columns
    howOften = document.getElementById('times').value, //rows
    row,
    r,
    col,
    c;

    var myImages = new Array();
    myImages[0] = "http://www.olsug.org/wiki/images/9/95/Tux-small.png";
    myImages[1] = "http://a2.twimg.com/profile_images/1139237954/just-logo_normal.png";
    for (var i = 0; i < myImages.length; i++) {
        var allImages = new Image();
        allImages.src = myImages[i];

        var my_div = document.createElement("div");
        my_div.id = "showPics";
        document.body.appendChild(my_div);
        var newList = document.createElement("ul");
        newList.appendChild(allImages);
        my_div = document.getElementById("showPics");
        my_div.appendChild(newList);
        my_div.style.display = 'none';
    }
    header.innerHTML = taskName;
    table.appendChild(header);

    header.innerHTML = taskName;
    table.appendChild(header);

    function addImage(col) {
        var img = new Image();
        img.src = "http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png";
        col.appendChild(img);
        img.onclick = function () {
            my_div.style.display = 'block';

            allImages.onclick = function (e) { // I THINK THIS IS THE PROBLEM
                img.src = e.target.src;
                my_div.style.display = 'none';
                img.onclick=null;
            };
        }

    }

    for (r = 0; r < howOften; r++) {
        row = table.insertRow(-1);
        for (c = 0; c < numDays; c++) {
            col = row.insertCell(-1);
            addImage(col);
        }
    }

    document.getElementById('holdTable').appendChild(table);
    document.getElementById('createChart').onclick=null;
}

Antworten auf die Frage(2)

Ihre Antwort auf die Frage