Display von 2 Elementen wechseln lassen

[Eydamos]

Also Ich habe 2 Tabellen mit einer Statistik. Die erste ist die Alte Version und die zweite die neue Version. Ich habe es so eingestellt, das beim laden der Seite die erste Tablle gezeigt und die zweite versteckt wird. Nun will ich über einen Link die erste Tabelle verstecken und gleichzeitig die zweite dafür anzeigen lassen, aber ich krieg es einfach nicht hin. Zig Versionen geschrieben aber keine hat so geklappt wie es sollte.

Hier mal das Grobe Script:

<script language="javascript" type="text/javascript">
function wechsel($1)
{
 var obj1 = document.getElementById("neu");
 var obj2 = document.getElementById("alt");

if($1 == 1)
 {
 obj2.style.display = ( obj2.style.display != "none" ) ? "none" : "";
 obj1.style.display = ( obj1.style.display != "show" ) ? "show" : "";
 }
 else if($1 == 2)
 {
 obj2.style.display = ( obj2.style.display != "show" ) ? "show" : "";
 obj1.style.display = ( obj1.style.display != "none" ) ? "none" : "";

}
}
</script>

<a href="javascript:wechsel(1);">Alte Statistik</a><br>
<a href="javascript:wechsel(2);">Neue Statistik</a><br>

<div id="alt" style="display: show">
<table>
Inhalt
</table>
</div>

<div id="neu" style="display: none">
<table>
Inhalt
</table>
</div>

[JürgenB]

Hallo Eydamos,

... Zig Versionen geschrieben aber keine hat so geklappt wie es sollte.

Lieber einen Tag rumprobieren als fünf Minuten Handbuch lesen?

obj1.style.display = ( obj1.style.display != "show" ) ? "show" : "";

siehe http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display.
Die Defaulteigenschaft kann man mit xxx.style.display="" einstellen.

Über den Übergabeparameter steuerst Du ja schon, welches Element Du zeigen willst. Die Abfragerei kann daher entfallen:

  
function wechsel(was)  
{  
 var obj1 = document.getElementById("neu");  
 var obj2 = document.getElementById("alt");  
  
 if(was == 1)  
 {  
  obj2.style.display =  "none";  
  obj1.style.display =  "";  
 }  
 else  
 {  
  obj2.style.display = "";  
  obj1.style.display = "none";  
 }  
} 

Gruß, Jürgen

[Eydamos]

Lieber einen Tag rumprobieren als fünf Minuten Handbuch lesen?

JavaScript habe ich kaum mit gearbeitet und ich finde da kann man irgendwie schlechter nach googeln. Bei php sind die Befehle eindeutiger und leichter zu googeln um nen Handbuch auszug zu bekommen. Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter.

siehe http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display.
Die Defaulteigenschaft kann man mit xxx.style.display="" einstellen.

Soweit war mir das auch klar hab halt nur noch den Kram mit der Klammer eingefügt, weils mit der bloßen zuweisung nicht geklappt hat. Wenn ich folgenden Code hatte:
obj1.style.display = "show";
obj2.style.display = "none";
hat er mir immer gesagt er hat das zweite display nicht gefunden und nicht geändert.
»»

Über den Übergabeparameter steuerst Du ja schon, welches Element Du zeigen willst. Die Abfragerei kann daher entfallen:

function wechsel(was)
{
var obj1 = document.getElementById("neu");
var obj2 = document.getElementById("alt");

if(was == 1)
{
  obj2.style.display =  "none";
  obj1.style.display =  "";
}
else
{
  obj2.style.display = "";
  obj1.style.display = "none";
}
}

»»  
Danke dein Code klappt. Dachte ich muss dem zwingend dann show sagen wenn er es anzeigen soll.

[wahsaga]

hi,

JavaScript habe ich kaum mit gearbeitet und ich finde da kann man irgendwie schlechter nach googeln.

Das hängt wohl davon ab, nach welcher Information man eigentlich sucht.

Bei php sind die Befehle eindeutiger und leichter zu googeln um nen Handbuch auszug zu bekommen. Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter.

Was denn jetzt - "bei PHP ist es besser", aber "wenn das bei JS auch so ist wie bei PHP, bringt es nicht weiter"? Da widersprichst du dir ja irgendwie selber.

Danke dein Code klappt. Dachte ich muss dem zwingend dann show sagen wenn er es anzeigen soll.

Wenn dein Hauptfehler darin lag, display einen ungültigen Wert zuzuweisen - dann brauchst du doch gar nicht über "JS-Handbücher" und was man in denen alles nicht findet, zu lamentieren - dann hättest du dir erst mal anschauen sollen, welche Wert für die CSS-Eigenschaft display gültig sind.

gruß,
wahsaga

[Eydamos]

Bei php sind die Befehle eindeutiger und leichter zu googeln um nen Handbuch auszug zu bekommen. Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter.

Was denn jetzt - "bei PHP ist es besser", aber "wenn das bei JS auch so ist wie bei PHP, bringt es nicht weiter"? Da widersprichst du dir ja irgendwie selber.

Nicht wirklich, wenn du den Satz so liest wie er da steht. Ich weiß normalerweise findet man im I-net keine Interpunktion auber ich steh drauf *g*
"Bei php sind die Befehle eindeutiger und leichter zu googeln um nen Handbuch auszug zu bekommen."<-- PHP besser, weil man nach Befehlen leichter googeln kann, z.b. nach preg_match(). Bei js wäre ich nicht drauf gekommen, nach display zu googeln, um nen Handbuch auszug zu bekommen.
"Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter."<-- PHP ist zwar besser, weil leichter zu googeln, ABER handbücher scheiße (meistens jedenfalls).

Wenn dein Hauptfehler darin lag, display einen ungültigen Wert zuzuweisen - dann brauchst du doch gar nicht über "JS-Handbücher" und was man in denen alles nicht findet, zu lamentieren - dann hättest du dir erst mal anschauen sollen, welche Wert für die CSS-Eigenschaft display gültig sind.

Du hast dir nicht die Mühe gemacht den Link dir anzuschauen? oder wo hast du das mit show gefunden?

Das mit dem Show habe ich nirgens gefunden. Ich habe das Script in etwas andere Form von einem Kumpel bekommen, der es von irgendeiner Seite hatte. Dann wollte ich das umschreiben und da man im html code schreibt display="show" habe ich geschlussfolgert, dass man im js ebenfalls display auf Show setzen muss, denn das wäre logisch. Den Link habe ich ja erst später bekommen und hab ihn mir natürlich auch angesehen.

Hoffe ich hab nu alles *g*

[Struppi]

Das mit dem Show habe ich nirgens gefunden. ... da man im html code schreibt display="show" habe ich geschlussfolgert, ...

Das ist doch auch wieder falsch, was soll display="show" sein?

Wenn du die Seite gelesen hast, hast du sie nicht verstanden. Naja, dann kann man nichts machen.

Struppi.

[Eydamos]

Das mit dem Show habe ich nirgens gefunden. ... da man im html code schreibt display="show" habe ich geschlussfolgert, ...

Das ist doch auch wieder falsch, was soll display="show" sein?

Wenn du die Seite gelesen hast, hast du sie nicht verstanden. Naja, dann kann man nichts machen.

Struppi.

Anscheinend will keiner zuhören oder ihr versteht es nicht. Diese "Thesen" habe ich aufgestellt BEVOR ich den Handbuchlink bekommen habe. Jetzt wo ich den Auszug gelesen habe weiß ich ja wo der Fehler lag. *rolleye*
Demnnächst versuche ich eher mal nach nem Handbuch zu googeln.

[Eydamos]

Naja kommen wir back zur Topic. Es gibt anscheinend noch nen Fehler im Script. Im Firefox klappt alles tadelos. Nun lasse ich das ganze auf die menschheit los und schon wird mir berichtet, dass es nicht klappt. Und woran liegt es mal wieder? Richtig! Der IE(6) schießt quer. Man kann klicken so viel man will es tut sich nix. Ne Fehlermeldung wird auch nicht unten rechts angegeben.

Jemand ne Idee?

[wahsaga]

hi,

Jemand ne Idee?

</hilfe/charta.htm#tipps-fuer-fragende>

gruß,
wahsaga

[Eydamos]

hi,

Jemand ne Idee?

</hilfe/charta.htm#tipps-fuer-fragende>

gruß,
wahsaga

ok Seite gelesen und nun? ne genauere Beschreibung kann ich nicht geben. Im Firefox klappt es und im IE 6 klappt es nicht, ebenfalls in allen anderen auf IE basierenden Browsern. Ich bekomme keine Fehlermeldung und auf dem Bildschirm verändert sich garnix, wenn man auf den Link klickt. Der Quelltext ist weiter oben zu lesen. Wass soll ich den noch tun?

[wahsaga]

hi,

ok Seite gelesen und nun? ne genauere Beschreibung kann ich nicht geben.

Warum nicht?
Kein Mensch weiss, wie dein aktueller Code aussieht, noch in welcher Umgebung er sich befindet.

Das einfachste wäre ein Online-Beispiel.

Der Quelltext ist weiter oben zu lesen.

"Weiter oben" ist die Funktion zu lesen, die Jürgen dir gab.
Ob du beim Einbau noch weitere Fehler gemacht hast, können wir daran nicht sehen.

Wass soll ich den noch tun?

Abgesehen von obigem: Lernen, vernünftig zu zitieren. Fullquotes sind bäh.

gruß,
wahsaga

[Eydamos]

"Weiter oben" ist die Funktion zu lesen, die Jürgen dir gab.
Ob du beim Einbau noch weitere Fehler gemacht hast, können wir daran nicht sehen.

Und gaaaanz oben (mein erstes Posting) steht der Quelltext, nur, dass das Javascript nun natürlich durch das von Jürge ersetzt ist.

Abgesehen von obigem: Lernen, vernünftig zu zitieren. Fullquotes sind bäh.

Jawohl Meister

Ne Online Version zum anzeigen habe ich nicht, da das ganze in eine Datenbank eingebaut ist, die natürlich Passwortgeschützt ist und nur registrierte Benutzer können halt die Seiten sehen.

Aber hiernochmal der Code in Verkürzter weise:

  
<script language="javascript" type="text/javascript">  
function wechsel(was)  
{  
 var obj1 = document.getElementById("alt");  
 var obj2 = document.getElementById("neu");  
  
 if(was == 1)  
 {  
 obj1.style.display =  "";  
 obj2.style.display =  "none";  
 }  
 else  
 {  
 obj1.style.display = "none";  
 obj2.style.display = "";  
 }  
}  
</script>  
  
<a href="javascript:wechsel(1);">Alte Statistik</a><br>  
<a href="javascript:wechsel(2);">Neue Statistik</a><br>  
  
<div id="alt">  
<table>  
Inhalt  
</table>  
</div>  
  
<div id="neu" style="display: none">  
<table>  
Inhalt  
</table>  
</div>  

[Struppi]

Aber hiernochmal der Code in Verkürzter weise:

Das Problem ist, das ein leerer Wert in den Styleangaben, die Eigenschaft wieder auf Ausgangswert zurücksetzten (hat Jürgen beiläufig auch erwähnt, glaube ich)

d.h. du könntest z.b. aus den Leerstrings ein "block" machen.

Struppi.

[Eydamos]

d.h. du könntest z.b. aus den Leerstrings ein "block" machen.

  
<script language="javascript" type="text/javascript">  
function wechsel(was)  
{  
 var obj1 = document.getElementById("alt");  
 var obj2 = document.getElementById("neu");  
  
 if(was == 1)  
 {  
 obj1.style.display =  "block";  
 obj2.style.display =  "none";  
 }  
 else  
 {  
 obj1.style.display = "none";  
 obj2.style.display = "block";  
 }  
}  
</script>  

Ist das so richtig? klappen tut es nämlich leider nicht. Der IE zeigt immernoch keine Reaktion

[Struppi]

Ist das so richtig? klappen tut es nämlich leider nicht. Der IE zeigt immernoch keine Reaktion

Ja, aber dein HTML code ist kaputt und natürlich musst du auch erkennen können ob etwas passiert, wenn beide Inhalte identisch sind merkst du ja keinen Unterschied.

Struppi.

[Eydamos]

Ja, aber dein HTML code ist kaputt und natürlich musst du auch erkennen können ob etwas passiert, wenn beide Inhalte identisch sind merkst du ja keinen Unterschied.

Das was ich gepostet habe ist ne abgespeckte Version. Die Beiden Tabellen sehen sehr unterschiedlich aus, folglich kann man auch einen unterschied sehen, wie gesagt im Firefox klappt der wechsel.

[Struppi]

Ja, aber dein HTML code ist kaputt und natürlich musst du auch erkennen können ob etwas passiert, wenn beide Inhalte identisch sind merkst du ja keinen Unterschied.
Das was ich gepostet habe ist ne abgespeckte Version. Die Beiden Tabellen sehen sehr unterschiedlich aus, folglich kann man auch einen unterschied sehen, wie gesagt im Firefox klappt der wechsel.

Tja, was soll ich sagen? Ich kann dir noch die Seite die dir wahsag schon gezeigt zeigen, ich kann mit dir gemeinsam in einen wehklagen einstimmen, nur dein Problem lösen kann ich so nicht.

Denn bei mir zeigt der IE (7) eine Reaktion.

Struppi.

[Struppi]

Ich kann ...

Ich könnte auch das Lesen was ich schreibe, bevor ich es abschicke. Dann würde ich mich auch nicht so über meine Tippfehler erschrecken.

Struppi.

[Eydamos]

http://eydamos.de/selghtml.htm

Ich muss jetzt leider weg sobald ich wieder da bin mache ich ne ausführlichere Version mit den Inhalten der Tabelle, so wie sie auf meiner Seite ausgegeben werden.

[Eydamos]

sorry Tippfehler natürlich sieht der Link so aus:

http://eydamos.de/selfhtml.htm

[Struppi]

http://eydamos.de/selfhtml.htm

Arggghhh, Wie kommst du auf die blöde Idee einen Button in einem Link einzubauen?
ausserdem ist deine Tabelle falsch aufgebaut.

Struppi.

[Eydamos]

Arggghhh, Wie kommst du auf die blöde Idee einen Button in einem Link einzubauen?

Bin javascript noob ich kann nur PHP also bin ich auf die Idee mit dem OnClick nicht gekommen. Habe den Link entfernt und dan Button mit nem OnClick versehen und es funzt! Vielen Dank an alle!

ausserdem ist deine Tabelle falsch aufgebaut.

Die habe ich in windeseile getippt, dass die Zeile:
<td>Dies ist die alte Tabelle</td>
und nicht:
<td>Dies ist die alte Tabelle</tr>
heißen muss weiß ich selber.

Also nochmals vielen Danke und bis bald euer JS-Noob *g*

[wahsaga]

hi,

Bin javascript noob ich kann nur PHP also bin ich auf die Idee mit dem OnClick nicht gekommen. Habe den Link entfernt und dan Button mit nem OnClick versehen und es funzt! Vielen Dank an alle!

Vielleicht siehst du jetzt ein, warum wir von dir wissen wollten, wie dein _aktueller_ Code aussah - von diesem fehlerhaften Versuch war nämlich in deinem anfangs geposteten Code noch gar nichts zu erkennen.

gruß,
wahsaga

[Eydamos]

» Vielleicht siehst du jetzt ein, warum wir von dir wissen wollten, wie dein _aktueller_ Code aussah - von diesem fehlerhaften Versuch war nämlich in deinem anfangs geposteten Code noch gar nichts zu erkennen.

Ja ich habs gesehen und werde es das nächste mal besser machen.

[wahsaga]

hi,

http://eydamos.de/selfhtml.htm

Das "funzt" auch im IE 6, wenn ich
javascript:wechsel(1);
bzw.
javascript:wechsel(2);
in die Adresszeile eingebe.

Also scheinen ihm lediglich deine Konstrukte der Form

<a href="javascript:wechsel(1);"><input type="button" value="Alte Statistik"></a>

nicht zu schmecken.

Warum nutzt du nicht einfach gleich onclick auf einem Button?

<input type="button" value="Alte Statistik" onclick="wechsel(1);">

gruß,
wahsaga

[Struppi]

http://eydamos.de/selghtml.htm

File not found

Ich muss jetzt leider weg sobald ich wieder da bin mache ich ne ausführlichere Version mit den Inhalten der Tabelle, so wie sie auf meiner Seite ausgegeben werden.

besser ist das, denn so kommen wir nicht weiter.

Struppi.

[Eydamos]

Denn bei mir zeigt der IE (7) eine Reaktion.

Tja irgendwie hatte ich geahnt, das der IE 7 zumindest ein wenig besser ist als sein Vorgänger und macht was er soll. Problem es geht nicht um mich und den Browser den ich drauf habe (die palette reicht von IE6 über diverse IE ableger wie avant und maxthon bis hin zu firefox und opera), sondern um den Browser, den meine User haben, und 99% von denen die den IE nutzen haben nurnmal Version 6 und sind PC Noobs genug um es nicht zu schaffen Version 7 aufzuspielen. Fazit: Ich muss ne Lösung finden, die auch im IE6 klappt.

[JürgenB]

Hallo Eydamos,

das Ratespiel bringt uns und Dich nicht wirklich weiter. Bitte poste mal den Code (oder stell ihn irgendwo online) wie er beim Browser ankommt (view source). Auch wenn die Inhalte aus einer Datenbank kommen, der Browser sieht nur HTML und Co.
Evtl. vertrauliches kannst Du ja durch Platzhalter ersetzen.

Gruß, Jürgen

[Jonathan]

Hallo,

Denn bei mir zeigt der IE (7) eine Reaktion.

Bei meinem IE6 klappt auch alles.

Jonathan

[JürgenB]

Hallo Struppi,

Denn bei mir zeigt der IE (7) eine Reaktion.

habe das gerade ebenfalls getestet, mit Tabellen im div, geht im IE7 und im FF2.

Ich hatte "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">".

Gruß, Jürgen

[JürgenB]

Hallo Struppi,

Das Problem ist, das ein leerer Wert in den Styleangaben, die Eigenschaft wieder auf Ausgangswert zurücksetzten (hat Jürgen beiläufig auch erwähnt, glaube ich)

ich habe "Defaulteigenschaft" geschrieben, ohne daran zu denken, das es da "Interpretationsspielraum gibt.

d.h. du könntest z.b. aus den Leerstrings ein "block" machen.

so mache ich es auch. Ich war bei meiner erste Antwort nur vorsichtig, da von Tabellen die Rede war und es mit display="table" auch Probleme gibt.

Gruß, Jürgen

[Struppi]

ok Seite gelesen und nun? ne genauere Beschreibung kann ich nicht geben.

Es würde schon helfen wenn du uns ungefähr zeigen würdest, was du jetzt konkret machst. Aus den diversen vorhanden Codeschnipsel im Thread, läßt sich für uns nur schwer ein Bild machen, was du jetzt konkret tust.

Struppi.

[JürgenB]

Hallo Eydamos,

nachdem ich Dir die entsprechende Seite schon aufgeschlagen habe, widerhole ich mich noch einmal:

Lieber einen Tag rumprobieren als fünf Minuten Handbuch lesen!

Gruß, Jürgen

PS Vieleicht bin ich ja schon zu alt, aber diese Einstellung, egal ob in Hobby oder Beruf, werde ich nie verstehen.

[wahsaga]

hi,

"Bei php sind die Befehle eindeutiger und leichter zu googeln um nen Handbuch auszug zu bekommen."<-- PHP besser, weil man nach Befehlen leichter googeln kann, z.b. nach preg_match().

Wozu denn überhaupt noch Googlen, wenn man den Namen einer Funktion bereits kennt?
Dann kannst du sie doch gleich im Handbuch nachschlagen.

Bei js wäre ich nicht drauf gekommen, nach display zu googeln, um nen Handbuch auszug zu bekommen.

Da wäre auch sonst kein vernünftiger Mensch drauf gekommen. Der Unterschied zwischen ihm und dir ist nur, dass er inzwischen - der Hinweis kam ja nun schon mehrmals - begriffen haben dürfte, dass display eine CSS-Eigenschaft ist, und mit Javascript absolut Null zu tun hat.

"Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter."<-- PHP ist zwar besser, weil leichter zu googeln, ABER handbücher scheiße (meistens jedenfalls).

_Das_ Handbuch von PHP ist alles andere als "Scheiße".
Man muss nur auch lernen, mit solchen Dokumenten umzugehen.

Dann wollte ich das umschreiben und da man im html code schreibt display="show" habe ich geschlussfolgert, dass man im js ebenfalls display auf Show setzen muss, denn das wäre logisch.

Schlussfolgerungen solltest du aus realen Gegebenheiten ziehen, nicht aus Fieberträumen oder chemisch bedingten Halluzinationen.

gruß,
wahsaga

[Struppi]

siehe http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display.
Die Defaulteigenschaft kann man mit xxx.style.display="" einstellen.

Soweit war mir das auch klar ...

Aha.

Dachte ich muss dem zwingend dann show sagen wenn er es anzeigen soll.

Du hast dir nicht die Mühe gemacht den Link dir anzuschauen? oder wo hast du das mit show gefunden?

Das paßt natürlich zu deiner Aussage (abgesehen von dem Formulierungsfehler):

Und wenn die Handbücher bei js genauso toll sind wie die von php bringt einen das nicht unbedingt weiter.

Wenn man es nicht liest, dann natürlich nicht.

Struppi.