Romero: <TD> mit onClick-Event versehen

Beitrag lesen

Ich hab die Lösung gefunden, warum es nicht funktionierte, warum kein Click-Event stattfand, obwohl ich es eigentlich (aus einem anderen Script) klappen müsste.

An der Stelle, wo die Tabelle erscheinen soll, hab ich folgendes deklariert:

document.getElementById("Dok_Ausgabe").innerHTML = '...';
			
//-------------------------------//
//-- Tabellen-Gerüst erstellen --//
//-------------------------------//
var Tabelle = document.createElement("table");
Tabelle.className = "Dok_Ausgabe_Tabelle1";
var Tabelle_tbody = document.createElement("tbody");
Tabelle_tbody.id = "Dok_Ausgabe_Tabelle";
Tabelle.appendChild(Tabelle_tbody);
document.getElementById("Dok_Ausgabe").appendChild(Tabelle);

var TR_Kopf = document.createElement("tr");
var TD_Kopf_1 = document.createElement("td");
... //=> weiterer Aufbau der Tabelle

function test() { return function() { alert("gib mir was aus!"); }; };

var TR_in_Tabelle = document.getElementById("Dok_Ausgabe_Tabelle").getElementsByTagName("tr");
for( var i = 0; i < TR_in_Tabelle.length; i++ )
{
	var INPUT_in_TR = TR_in_Tabelle[i].getElementsByTagName("input");
	for( var j = 0; j < INPUT_in_TR.length; j++ ) { var INPUT_Klick = INPUT_in_TR[j]; INPUT_Klick.onclick = test(); };
};

document.getElementById("Dok_Ausgabe").innerHTML += '...';

Ich habe dann alles in der Ober-Funktion auskommentiert, was nicht direkt mit der Tabelle in zusammenhang stand, um nur rein die Funktionalität zu prüfen. Und da habe ich festgestellt, dass das untere

document.getElementById("Dok_Ausgabe").innerHTML += '...';

für das Nicht-Ausführen der Funktion test() ist, bzw. beim Klick auf den Button, da nicht das alert() angezeigt wird.

Nun habe ich es ein wenig umgebaut, und es sieht nun wie folgt aus (was nun erfolgreich funktioniert):

document.getElementById("Dok_Ausgabe").innerHTML = '...';
			
//-------------------------------//
//-- Tabellen-Gerüst erstellen --//
//-------------------------------//
var Tabelle = document.createElement("table");
Tabelle.className = "Dok_Ausgabe_Tabelle1";
var Tabelle_tbody = document.createElement("tbody");
Tabelle_tbody.id = "Dok_Ausgabe_Tabelle";
Tabelle.appendChild(Tabelle_tbody);
document.getElementById("Dok_Ausgabe").appendChild(Tabelle);

document.getElementById("Dok_Ausgabe").innerHTML += '...'; //=> das war in meinem Falle der "Störenfried", der mich verzweifeln lies

//===> ab hier erfolgt der Aufbau der Spalten/Zeilen und der weiteren Funktionen
var TR_Kopf = document.createElement("tr");
var TD_Kopf_1 = document.createElement("td");
... //=> weiterer Aufbau der Tabelle

function test() { return function() { alert("gib mir was aus!"); }; };

var TR_in_Tabelle = document.getElementById("Dok_Ausgabe_Tabelle").getElementsByTagName("tr");
for( var i = 0; i < TR_in_Tabelle.length; i++ )
{
	var INPUT_in_TR = TR_in_Tabelle[i].getElementsByTagName("input");
	for( var j = 0; j < INPUT_in_TR.length; j++ ) { var INPUT_Klick = INPUT_in_TR[j]; INPUT_Klick.onclick = test(); };
};

Danke dennoch an Eure Ansätze, und das ich weiterhin immer noch dazulernen kann. Aber: kann mir da jemand erklären, warum es sich so (siehe ersten Script-Auszug) verhielt?

LG Romero