nicht angemeldet
Problem mit FireFox und document.getElementById().style.display
2 
JürgenB
Problem mit FireFox und document.getElementById().style.display
Gunnar BittersmannHallo zusammen,
beim ein und Ausblenden von Zeilen in einer Tabelle verlieren diese ihren Bezug bzw. Ausrichtung in einer Tabelle. (im IE funktioniert es, im FireFox nicht)
Hat da jemand eine Lösung für mich?
Code Beispiel:
<html>
<head>
<script type="text/javascript">
<!--
var gruppenwerte=0;
var gruppe=new Array(20);
for(var i=0; i<20; i++) { gruppe[i]="auf"; }
if(document.cookie)
{ ReadCookie(); }
function ReadCookie()
{ var allcookies = document.cookie;
cookiearray = allcookies.split(';');
gruppenwerte=0;
var Suche = /Gruppe/;
for(var i=0; i<cookiearray.length; i++)
{ name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[1];
if((value=="auf"||value=="zu")&&(Suche.test(name)))
{ gruppe[gruppenwerte]=value;
gruppenwerte++;
}
}
}
function WriteCookie()
{ for(var i=0; i<gruppenwerte; i++)
{ document.cookie="Gruppe" + i + "=" + gruppe[i] + ";";
}
}
function zu(nr)
{ gruppe[nr]="zu";
//für den Fall, dass die Gruppe noch nicht im Cookie enthalten ist
if(gruppenwerte<nr+1) gruppenwerte=nr+1;
WriteCookie();
}
function auf(nr)
{ gruppe[nr]="auf";
WriteCookie();
}
function start()
{ for(var gruppe_nr=0; gruppe_nr<gruppenwerte; gruppe_nr++)
{ if ( gruppe[gruppe_nr] == "zu" )
{ document.getElementById('Gruppe' + gruppe_nr + ' 1').style.display='block';
document.getElementById('Gruppe' + gruppe_nr + ' 2').style.display='none';
for(var i=0; i<20; i++)
{ if(document.getElementById('z' + gruppe_nr + ' ' + i))
{ document.getElementById('z' + gruppe_nr + ' ' + i).style.display='none';
}
}
}
else
{ document.getElementById('Gruppe' + gruppe_nr + ' 1').style.display='none';
document.getElementById('Gruppe' + gruppe_nr + ' 2').style.display='block';
for(var i=0; i<20; i++)
{ if(document.getElementById('z' + gruppe_nr + ' ' + i))
{ document.getElementById('z' + gruppe_nr + ' ' + i).style.display='block';
}
}
}
}
}
//-->
</script>
</head>
<body onload='start()'>
<table id="tab" border="1">
<tr>
<th>Spalte..........1</th>
<th>Spalte....2</th>
</tr>
<tr id="Gruppe0 1" onclick="auf(0); start(); this.style.display='none'" style="display:none;">
<td colspan=2>+ Gruppe0 "click mich"</td>
</tr>
<tr id="Gruppe0 2" onclick="zu(0); start(); this.style.display='none'">
<td colspan=2>- Gruppe0 "click mich"</td>
</tr>
<tr id="z0 0"> <td>z1 f1</td> <td>z1 f2</td>
</tr>
<tr id="z0 1"> <td>z2 f1</td> <td>z2 f2</td>
</tr>
<tr id="Gruppe1 1" onclick="auf(1); start(); this.style.display='none'" style="display:none;">
<td colspan=2>+ Gruppe1 "click mich"</td>
</tr>
<tr id="Gruppe1 2" onclick="zu(1); start(); this.style.display='none'">
<td colspan=2>- Gruppe1 "click mich"</td>
</tr>
<tr id="z1 0"> <td>z1 f1</td> <td>z1 f2</td>
</tr>
<tr id="z1 1"> <td>z2 f1</td> <td>z2 f2</td>
</tr>
<tr id="Gruppe2 1" onclick="auf(2); start(); this.style.display='none'" style="display:none;">
<td colspan=2>+ Gruppe2 "click mich"</td>
</tr>
<tr id="Gruppe2 2" onclick="zu(2); start(); this.style.display='none'">
<td colspan=2>- Gruppe2 "click mich"</td>
</tr>
<tr id="z2 0"> <td>z1 f1</td> <td>z1 f2</td>
</tr>
<tr id="z2 1"> <td>z2 f1</td> <td>z2 f2</td>
</tr>
<META HTTP-EQUIV=Refresh CONTENT='5; URL=dieseSeite.htm'>
</body></html>
^^dieseSeite.htm Umbenennen!
MfG
Heimwerker
-
Hallo Heimwerker,
{ document.getElementById('Gruppe' + gruppe_nr + ' 1').style.display='block';hiermit machst du das tr zu einem Blockelement. Wenn du Tabellenelemente anzeigen willst, setze display lieber auf seinen Defaultwert:
...display="";Gruß, Jürgen
-
Hallo Heimwerker,
{ document.getElementById('Gruppe' + gruppe_nr + ' 1').style.display='block';hiermit machst du das tr zu einem Blockelement. Wenn du Tabellenelemente anzeigen willst, setze display lieber auf seinen Defaultwert:
...display="";Gruß, Jürgen
KLASSE...
Tausend Dank, ich versuche das seit Stunden irgend wie zum Laufen zu bekommen :-)-
@@Heimwerker:
nuqneH
KLASSE...
Tausend Dank, ich versuche das seit Stunden irgend wie zum Laufen zu bekommen :-)Tja, wenn du es gleich richtig[tm] gemacht hättest …
Es ist NIE eine gute Idee, CSS-Eigenschaften per JavaScript zu ändern.
„Was hingegen schwer ist, ist in die Köpfe der Menschen zu bringen, dass Layout-Informationen *in den CSS-Code* gehören, *nicht* in den JavaScript-Code. JavaScript ist wunderbar geeignet, die DOM-Objekte auf eine Weise zu verändern, die in CSS genutzt werden kann.“ [Cheatah]
„KLASSE“ war da schon passend. ;-)
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
Es ist NIE eine gute Idee, CSS-Eigenschaften per JavaScript zu ändern.
NIE ist doch ein bischen übertrieben, oder? Was, wenn ich ein Element neu positionieren möchte?
Oder "nur" ein-/ausblenden. Dafür eine neue CSS-Klasse und diese per JS austausche? Ich denke die Lösung sollte der Aufgabe auch angemssen sein.Gruß,
Siri-
@@Siri:
nuqneH
NIE ist doch ein bischen übertrieben, oder?
Nö.
Was, wenn ich ein Element neu positionieren möchte?
Oder "nur" ein-/ausblenden. Dafür eine neue CSS-Klasse und diese per JS austausche?Ja!! Trenne Präsentation (CSS) und Verhalten (JavaScript) voneinander! Ändere keine CSS-Eigenschaften per JavaScript! Kuckst du.
Ich denke die Lösung sollte der Aufgabe auch angemssen sein.
Eben.
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
mal angenommen ich möchte ein Bild oder einen Div per Drag and Drop über den Bildschirm schieben.
Nicht per dragElement.style.top und dragElement.style.width?
Gruß,
Siri-
@@Siri:
nuqneH
mal angenommen ich möchte ein Bild oder einen Div per Drag and Drop über den Bildschirm schieben.
Nicht per dragElement.style.top und dragElement.style.width?
Hm, dann sprechen wir eher über eine Webapp als eine Webseite?
OK, manchmal wird man CSS-Eigenschaften mit JavaScript ändern wollen. Das gehört dann eher zur Verhaltensschicht als zur Päsentationsschicht.
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)
-
-
-
@@Siri:
nuqneH
Dafür eine neue CSS-Klasse …
BTW: Es gibt keine „CSS-Klassen“. Wirklich nicht.
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)
-
-
-
-