nicht angemeldet
Sprich; du willst mit Klick auf eine Tabellenzelle eine andere einblenden; wenn ich das richtig verstehe.
Nein!
Je nach Fortschritt des Programms soll entweder eine Zeile, Spalte oder Zelle eingefärbt werden, also die bg-color geändert werden.
Ich schon mehrere Varianten versucht, aber keine klappt so richtig:
Variante 0:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Tabelle generieren</title>
<script type='text/javascript'>
<!--
function Markieren(Zeile,Spalte)
{
alert("TEST1");
/*
document.getElementById("Zelle"+Zeile+Spalte).setAttribute('bgColor','#ffff00');
*/
};
function Normalisieren(Zeile,Spalte)
{
alert("TEST2");
};
function Aktivitaet(Zeile,Spalte)
{
alert("Zeile: " + Zeile + " Spalte: " + Spalte);
};
function LadenMZ() {
document.write("<table border='1' cellpadding='5' cellspacing='0'>");
document.write("<tr>");
document.write("<td id = 'Zelle110' onmouseover = 'Markieren(1,10)' onmouseout = 'Normalisieren(1,10)' onclick = 'Aktivitaet(1,10)'><p id = 'Raster110'>Z110</p></td>");
document.write("<td id = 'Zelle111' onmouseover = 'Markieren(1,11)' onmouseout = 'Normalisieren(1,11)' onclick = 'Aktivitaet(1,11)'><p id = 'Raster111'>Z111</p></td>");
document.write("<td id = 'Zelle112' onmouseover = 'Markieren(1,12)' onmouseout = 'Normalisieren(1,12)' onclick = 'Aktivitaet(1,12)'><p id = 'Raster112'>Z112</p></td>");
document.write("<td id = 'Zelle113' onmouseover = 'Markieren(1,13)' onmouseout = 'Normalisieren(1,13)' onclick = 'Aktivitaet(1,13)'><p id = 'Raster113'>Z113</p></td>");
document.write("<td id = 'Zelle114' onmouseover = 'Markieren(1,14)' onmouseout = 'Normalisieren(1,14)' onclick = 'Aktivitaet(1,14)'><p id = 'Raster114'>Z114</p></td>");
document.write("</tr>");
document.write("<tr>");
document.write("<td id = 'Zelle210' onmouseover = 'Markieren(2,10)' onmouseout = 'Normalisieren(2,10)' onclick = 'Aktivitaet(2,10)'><p id = 'Raster210'>Z210</p></td>");
document.write("<td id = 'Zelle211' onmouseover = 'Markieren(2,11)' onmouseout = 'Normalisieren(2,11)' onclick = 'Aktivitaet(2,11)'><p id = 'Raster211'>Z211</p></td>");
document.write("<td id = 'Zelle212' onmouseover = 'Markieren(2,12)' onmouseout = 'Normalisieren(2,12)' onclick = 'Aktivitaet(2,12)'><p id = 'Raster212'>Z212</p></td>");
document.write("<td id = 'Zelle213' onmouseover = 'Markieren(2,13)' onmouseout = 'Normalisieren(2,13)' onclick = 'Aktivitaet(2,13)'><p id = 'Raster213'>Z213</p></td>");
document.write("<td id = 'Zelle214' onmouseover = 'Markieren(2,14)' onmouseout = 'Normalisieren(2,14)' onclick = 'Aktivitaet(2,14)'><p id = 'Raster214'>Z214</p></td>");
document.write("</tr>");
document.write("<tr>");
document.write("<td id = 'Zelle310' onmouseover = 'Markieren(3,10)' onmouseout = 'Normalisieren(3,10)' onclick = 'Aktivitaet(3,10)'><p id = 'Raster310'>Z310</p></td>");
document.write("<td id = 'Zelle311' onmouseover = 'Markieren(3,11)' onmouseout = 'Normalisieren(3,11)' onclick = 'Aktivitaet(3,11)'><p id = 'Raster311'>Z311</p></td>");
document.write("<td id = 'Zelle312' onmouseover = 'Markieren(3,12)' onmouseout = 'Normalisieren(3,12)' onclick = 'Aktivitaet(3,12)'><p id = 'Raster312'>Z312</p></td>");
document.write("<td id = 'Zelle313' onmouseover = 'Markieren(3,13)' onmouseout = 'Normalisieren(3,13)' onclick = 'Aktivitaet(3,13)'><p id = 'Raster313'>Z313</p></td>");
document.write("<td id = 'Zelle314' onmouseover = 'Markieren(3,14)' onmouseout = 'Normalisieren(3,14)' onclick = 'Aktivitaet(3,14)'><p id = 'Raster314'>Z314</p></td>");
document.write("</tr>");
document.write('</table>');
document.close();
var testtext = document.getElementById("Raster314").firstChild.nodeValue;
alert(testtext);
};
function Markieren(Zeile,Spalte)
{
alert("TEST1");
/*
document.getElementById("Zelle"+Zeile+Spalte).setAttribute('bgColor','#ffff00');
*/
};
function Normalisieren(Zeile,Spalte)
{
alert("TEST2");
};
function Aktivitaet(Zeile,Spalte)
{
alert("Zeile: " + Zeile + " Spalte: " + Spalte);
};
//-->
</script>
</head>
<body style="background-color:#FFFFFF; padding:5px"
onload="LadenMZ()">
</body>
</html>
Variante 1:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Tabelle generieren</title>
<script type='text/javascript'>
<!--
function Markieren()
{
alert("TEST1");
/*
document.getElementById("Zelle"+Zeile+Spalte).setAttribute('bgColor','#ffff00');
*/
}
function Normalisieren()
{
alert("TEST2");
}
function Aktivitaet()
{
alert("TEST3");
/*
alert("Zeile: " + Zeile + " Spalte: " + Spalte);
*/
}
function LadenMZ() {
document.write('<table border="1" cellpadding="5" cellspacing="0">');
document.write('<tr id = "Zeile1">');
document.write('<td id = "Zelle110" width = 150><p id = "Raster110">Z110</p></td>');
document.write('<td id = "Zelle111" width = 150><p id = "Raster111">Z111</p></td>');
document.write('<td id = "Zelle112" width = 150><p id = "Raster112">Z112</p></td>');
document.write('<td id = "Zelle113" width = 150><p id = "Raster113">Z113</p></td>');
document.write('<td id = "Zelle114" width = 150><p id = "Raster114">Z114</p></td>');
document.write('</tr>');
document.write('<tr id = "Zeile2">');
document.write('<td id = "Zelle210" width = 150><p id = "Raster210">Z210</p></td>');
document.write('<td id = "Zelle211" width = 150><p id = "Raster211">Z211</p></td>');
document.write('<td id = "Zelle212" width = 150><p id = "Raster212">Z212</p></td>');
document.write('<td id = "Zelle213" width = 150><p id = "Raster213">Z213</p></td>');
document.write('<td id = "Zelle214" width = 150><p id = "Raster214">Z214</p></td>');
document.write('</tr>');
document.write('<tr id = "Zeile3">');
document.write('<td id = "Zelle310" width = 150><p id = "Raster310">Z310</p></td>');
document.write('<td id = "Zelle311" width = 150><p id = "Raster311">Z311</p></td>');
document.write('<td id = "Zelle312" width = 150><p id = "Raster312">Z312</p></td>');
document.write('<td id = "Zelle313" width = 150><p id = "Raster313">Z313</p></td>');
document.write('<td id = "Zelle314" width = 150><p id = "Raster314">Z314</p></td>');
document.write('</tr>');
document.write('</table>');
document.close();
var Zelle110 = document.getElementById("Zelle110");
Zelle110.addEventListener("mouseover", Markieren, true);
Zelle110.addEventListener("mouseout", Normalisieren, true);
Zelle110.addEventListener("click", Aktivitaet, true);
}
//-->
</script>
</head>
<body style="background-color:#FFFFFF; padding:5px"
onload="LadenMZ()">
</body>
</html>