2011-01-17 13 views
1

Ich habe eine Tabelle mit einigen CSS zu verstecken/Spalten zeigen. Jede td hat die Klassen "column" und "columnX", wobei X die Spaltennummer ist. Das css sieht so aus:Alte IEs aktualisieren CSS nicht dynamisch

.column { display: none; } 
table.show1 .column1 { display: block; } 
table.show2 .column2 { display: block; } 

Die Tabelle beginnt alle ausgeblendet und der Benutzer schaltet sie ein. Wenn dies geschieht, wird eine Tabelle wie "show1" oder "show2" zur Tabelle hinzugefügt, abhängig von der angezeigten Spalte.

Dies funktioniert hervorragend in FF, Chrom und IE8. Aber IE6/7 haben ein Problem, bei dem eine "Spalte" nicht zu "display: block" wird. Wenn ich jedoch in der Entwicklersymbolleiste gehe und die css-Regel umschalte,

table.showX .columnX {display: block; } 

es funktioniert gut. Es ist so, als ob diese alten Browser nicht wissen, dass sie die Tabelle aktualisieren müssen, wenn sie über Javascript ausgeführt werden. Auch, wenn ich eine Klasse wie "show0" zu der Tabelle hinzufügen (nicht in Javascript), funktioniert es in IE6/7 gut.

Alle bekannten Problemumgehungen dafür?

Antwort

0

Nun, zunächst ist der korrekte Anzeigewert für eine Tabellenzelle nicht "Block"; es ist "Tischzelle". Nun, das ist ein strittiger Punkt für alte Versionen von IE, da sie diese Art von ausgefallenem Zeug nicht wirklich verstehen.

nun das nächste Problem ist die Tatsache, dass alter IE (6 und 7, nicht 8) diese unterhaltsame Funktion haben, wenn zunächst Tabellenzellen machen: wenn, wenn die Tabelle ersten gemacht ist, eine Spalte von <td> (und einem <th> an der Spitze, wenn Sie möchten) Elemente ist nicht sichtbar, dann nachfolgende Änderungen an das DOM nie machen es sich zeigen. Es ist nur so dumm; in der Tat I've asked the same question here.

Was ich getan habe, um das Problem zu umgehen, ist einige JavaScript auf die Seite fallen, so dass nach der HTML-Code zuerst gerendert wird, kann einige Code zurück und dann die entsprechenden Spalten unsichtbar machen. So lange sie sichtbar sind, können sie danach ohne Zwischenfälle aus- und wieder eingeschaltet werden.

+0

Wie haben Sie Ihr Problem gelöst? Auch das Einstellen von visibility: hidden scheint nicht zu funktionieren, obwohl es als Fix vorgeschlagen wurde. Konntest du das zum Laufen bringen? –

+0

Nein, keiner dieser Vorschläge funktionierte für mich. Was ich hier gemacht habe, ist, was ich hier beschreibe: Die Spalten, die unsichtbar sein sollen, beginnen sichtbar, und dann lasse ich etwas Javascript laufen, um sie auszuschalten. Es ist lächerlich, aber es ist das Einzige, von dem ich weiß, dass es funktioniert. (Lass es mich wissen, wenn du etwas Besseres findest !!) – Pointy

+0

Oh, auch wenn das "Sichtbarkeit" Ding funktioniert hat, wäre es nicht das was du wahrscheinlich willst. In meinem Fall habe ich wirklich gewollt, dass die Spalten komplett weg sind. Mit "Sichtbarkeit: versteckt" würde immer noch Platz auf dem Bildschirm eingenommen. – Pointy