nicht angemeldet
Tabelle mit border=0 anzeigen
Hallo,
ich suche dringend eine Funktion, mit der man Tabellen mit border=0 anzeigen kann. Ich habe eine Funktion geschrieben, die den Style der
table und td Elemente verändert. Wie man an den alert-Anweisungen beim Durchlaufen des Skriptes sieht, werden alle Tabellenfelder korrekt mit der neuen Style-Eigenschaft angezeigt. Jedoch werden diese Änderungen nach Ende der Funktion wieder verworfen. Warum? Wie kann ich es erreichen, dass diese Änderungen vorhanden bleiben und durch eine andere Funktion wieder entfernt werden können? Die andere Funktion könnte ja ähnliche for-Schleifen haben, nur dass dann der borderStyle der td's und table's auf "" gesetzt wird oder ganz gelöscht wird.
Die andere Frage: In der Variables css_style habe ich die Styles hinterlegt, mit denen ich die Tabellenfelder ausstatten möchte. Wieso kann ich in den for-Schleifen nicht sagen workspace.all.tags('td')[i].style.borderStyle = css_style; ?
Für Hilfe wäre ich sehr dankbar.
MfG
Timo
<html>
<head>
<title>Test Tableborder</title>
</head>
<script language="Javascript">
var css_style = "BORDER-RIGHT: #bfbfbf 1px dotted; BORDER-LEFT: #bfbfbf 1px
dotted; BORDER-TOP: #bfbfbf 1px dotted; BORDER-BOTTOM: #bfbfbf 1px dotted;";
function changeCSS()
{
alert(document.all.tags('td').length);
alert(workspace.all.tags('td').length);
for(i=0;i<workspace.all.tags('td').length;i++)
{
workspace.all.tags('td')[i].style.borderStyle = "dashed";
alert(workspace.all.tags('td')[i].style.borderStyle);
}
for(i=0;i<workspace.all.tags('table').length;i++)
{
workspace.all.tags('table')[i].style.borderStyle = "dashed";
alert(workspace.all.tags('table')[i].style.borderStyle);
}
alert("Funktionsende");
//workspace.all.tags('table').style.borderStyle = "dashed";
//workspace.all.tags('td').style.borderStyle = "dashed";
}
</script>
<body>
<table width="700" border="1">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<p></p>
<div id="workspace">
<table width="700" border="1">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<p> </p>
<table width="700" border="1">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<p> </p>
</div>
<p> </p>
<p> </p>
<form name="form1" method="post" action="">
<input type="submit" name="Abschicken" value="Abschicken"
onclick="changeCSS()">
</form>
<p> </p>
</body>
</html>
-
Hallo,
das Problem dürfte weniger die Funktion als vielmehr ihr Aufruf sein. Beim Absenden des Formulars wird die Funktion ausgeführt und anschließend der Inhalt an sich selbst (action="") verschickt, d.h. die Seite wird neu geladen. In der neugeladenen Seite wurde die Funktion aber ja noch nicht ausgeführt, also ist wieder der Ausgangszustand erreicht.
Probier doch zu Testzwecken einfach aus die Funktion in einem Link aufzurufen a la <a href="#" onClick="ChangeCSS()">Test</a>
Grüße aus Würzburg
Julian-
Hallo Julian,
danke für Deine Antwort. Jetzt klappt es!
MfG
Timo
-