• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Seitenstatus abspeichern oder hervorufen

L

letscho

Neues Mitglied
Hallo zusammen,

ich habe auf meinen HTML-Seiten einen einfachen toggle zum ausklappen von Infoboxen oder in der index.html zum ausklappen der Struktur.

Meine Frage:
Ist es möglich den toggle-Status abzuspeichern um ihn dann beim zurückspringen wieder aufzurufen? Oder kann man beim zurückspringen über einen Link einen bestimmten toggle-Status hervorrufen?
D.h. ich möchte wenn ich von einer anderen, als der index.html, Seite zurück auf die index.html springe dort einen toggle sichtbar/aktiv haben.

Der toggle sieht wie folgt aus:

/* script to collapse or hide infobox link */
function toggle(elementId) {
var ele = document.getElementById(elementId);
if(ele.style.display == "block") {
ele.style.display = "none";
}
else {
ele.style.display = "block";
}
}

und wird z.B. über:

<a id="displayText" href="javascript:toggle('toggleTest');" class="info">zum ausklappen hier drücken</a>
<div id="toggleTransportation" style="display: none" href="javascript:toggle();">
<p>Dieser Text ist nur sichtbar wenn der Link geklickt wurde</p>
</div>

aufgerufen.
 
Werbung:
du kannst den local storage oder den session storage nutzen um das zu speichern. google einfach mal JavaScript local storage
 
Ich habe mal einen Test gemacht und festgestellt, dass der <body> onload-Event auch beim Zurück-Navigieren gefeuert wird. Du müsstest also folgendes tun:
  1. Verpasse jeder Seite eine eindeutige Id, beispielsweise als Text in einem hidden Element mit id=page_id.
  2. Beim Ändern der Style Elemente baust du zusätzlich ein Visibility-Objekt auf im Stil { id1:'block'; id2:'none', ... }.
  3. Das Visibility-Objekt speicherst du unter der page_id im sessionStorage ab.
  4. Bein onload liest du das Objekt wieder ein und setzt die Visibility entsprechend.
  5. Statt sessionStorage kannst auch localStorage nehmen, dann kann der User sogar den Browser schließen.
Nachtrag: Upps, da war der LeCub schneller, aber ich gab die die Detail-Idee :D
 
Werbung:
NetAktiv schrieb:
  1. ...
  2. Beim Ändern der Style Elemente baust du zusätzlich ein Visibility-Objekt auf im Stil { id1:'block'; id2:'none', ... }.
  3. Das Visibility-Objekt speicherst du unter der page_id im sessionStorage ab.
  4. Bein onload liest du das Objekt wieder ein und setzt die Visibility entsprechend.
  5. ...
Zum Vergrößern anklicken....
Damit kein Mißverständnis aufkommt, genau genommen kennt visibility kein block und none, sondern visible und hidden - https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Anzeige/visibility

Im gezeigten JS-Code wird stattdessen display verwendet - https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Anzeige/display
 
Spicelab schrieb:
Damit kein Mißverständnis aufkommt ...
Zum Vergrößern anklicken....
Da gab es keine Gefahr für ein Missverständnis, schon in Letscho's Beispielcode verwendete display und auch block und none können nur im Zusammenhang mit display auftauchen. Ich habe lediglich bei der funktionellen Beschreibung an Sichtbarkeit gedacht und das mit Visibility (statt Display) übersetzt.

Tronjer schrieb:
Das sind alles keine guten Lösungsansätze.....sondern über die URL
Zum Vergrößern anklicken....
Dieser Vorschlag hat in der Tat sehr viel Charme, schade dass ich die Idee nicht hatte. Mit dem URL-Ansatz
  • benötigt man keinen Storage, es kann also auch alte Browser unterstützen
  • Speichert der Browser den Seitenzustand automatisch im Verlauf.
  • Man kann die URL weiter geben oder in Favoriten speichern und die Seite wird entsprechend angezeigt.
  • Für eine Seite werden alle Zustandsübergänge gespeichert.
  • Es gibt scheinbar schon fertige Lösungen, um die Seite wieder herzustellen.
 
Zuletzt bearbeitet:
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben