Aktualisierung von HTML-Seiten

AlanHorman

Mitglied
Ich habe folgendes Problem:

In mehreren HTML-Seiten habe ich ein Script-Tag eingebaut, der eine Referenz auf eine externe JavaScript-Datei hält. Diese Datei blendet den Logout-Button im Menü aus.

Jede HTML-Seite hat ein sogenanntes SideBar-Menü.
Beim öffnen einer neuen Seite (egal welcher) klappt es auch und der Button wird ausgeblendet.
Sobald man aber den Browser aktualisiert, dann ist der Logout-Button wieder sichtbar.

Das habe ich erst festgestellt, als ich einen anderen Button auf der HTML-Seite geklickt habe und keine Reaktion kam. Da habe ich auf aktualisieren geklickt und dann funktionierte wieder dieser Button, doch dann kam auch mein oben genanntes Problem.

Wie kann ich diesen Fehler beheben?

Hier ist der HTML-Aufbau von dem Menü:
HTML:
  <div data-role="panel" id="myPanel">
  <h2>Menü</h2>
  <a href="index.html"><button>Startseite</button></a>
  <a href="ueberDasProjekt.html"><button>das Projekt</button></a>
  <a href="ueberDieHS.html"><button>die Hochschule</button></a>
  <a href="bedienungsanleitung.html"><button>Bedienungsanleitung</button></a>
  <a href="kontakt.html"><button>Kontakt</button></a>
  <a href="impressum.html"><button>Impressum</button></a>
  <a id="login" href="login.html"><button>Login</button></a>
       <a id="logout" href=""><button>Logout</button></a>
  <a id="reg" href="registration.html"><button>Registrieren</button></a>
  </div>

  <div data-role="main" class="ui-content">
  <a href="#myPanel" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Menü</a> <br>

  <div id="textBox2">
  <h1>Dies ist eine Beispielseite</h1>
  <a>Test</a>
  </div>
  </div>
 
Zuletzt bearbeitet von einem Moderator:
Hi,
bitte keine Buttons in Anchors verschachteln. Syntaktisch gesehen entweder das eine oder das andere.
Ein Anchor verlinkt etwas und ein Button löst eine Aktion aus.

Und falls ich die W3C Definition vom Anchor jetzt richtig im Kopf habe musst du ein href-Attribut verwenden.
Du kannst es aber leer lassen wenn du keine Ziel hast.

Auch hat sich etabliert ein Menü in einer UL zu verschachteln.

Ohne dein javascript zu sehen können wir jetzt nichts zu deinem Problem sagen. Den nicht das HTML wird das Problem sein sondern das JS.

Viele Grüße
 
So sieht der Code von der Datei aus, die ich in allen HTML-Seiten mit $.getScript("js/cookieControl.js"); eingebunden habe:
Javascript:
$.getScript('js/jquery.cookie.js');                               //Cookie-Plugin einbinden
   $.cookie('Keksi', 'Ja', {expires : 60});                       //Cookie mit dem Namen Keksi erstellen

   function hideReg(e) {            //Registrierbutton verstecken
     $('#reg1').hide();
     $('#reg2').hide();
     $('#reg3').hide();
     $('#reg4').hide();  
     $('#reg5').hide();
     $('#reg6').hide();
     $('#reg7').hide();
     $('#reg8').hide();    
     return false;
   }
  
   function hideLogin(e) {            //Loginbutton verstecken
     $('#login1').hide();
     $('#login2').hide();
     $('#login3').hide();
     $('#login4').hide();
     $('#login5').hide();
     $('#login6').hide();
     $('#login7').hide();
     $('#login8').hide();
     return false;
   }
  
   function showLogout(e) {         //Logoutbutton anzeigen
     $('#logout1').show();
     $('#logout2').show();
     $('#logout3').show();
     $('#logout4').show();
     $('#logout5').show();
     $('#logout6').show();
     $('#logout7').show();
     $('#logout8').show();
     return false;
   }
  
   function hideLogout(e) {            //Logoutbutton verstecken
     $('#logout1').hide();
     $('#logout2').hide();
     $('#logout3').hide();
     $('#logout4').hide();
     $('#logout5').hide();
     $('#logout6').hide();
     $('#logout7').hide();
     $('#logout8').hide();
     return false;
   }
    
   function showLogin(e) {               //Loginbutton anzeigen
     $('#login1').show();
     $('#login2').show();
     $('#login3').show();
     $('#login4').show();
     $('#login5').show();
     $('#login6').show();
     $('#login7').show();
     $('#login8').show();
     return false;
   }
    
   function showReg(e) {                     // Registrierbutton anzeigen
     $('#reg1').show();
     $('#reg2').show();
     $('#reg3').show();
     $('#reg4').show();  
     $('#reg5').show();
     $('#reg6').show();
     $('#reg7').show();
     $('#reg8').show();  
     return false;    
   }
  
   function login(e) {
     hideLogout();
     showReg();
     showLogin();
     return false;
   }
  
   function logout(e) {
     showLogout();
     hideReg();
     hideLogin();
     return false;
   }
  
   function cookieFunc(e)
   {
     //if ($.cookie('Keksi')== 'Ja') {
       //login();
     //}
    
     //if ($.cookie('Keksi')== 'Nein') {
       logout();
     //}
   }

   cookieFunc();
Ich wollte in dieser externen einen Cookie erstellen, mit dem ich dann es leichter habe eine globale Variable zu setzen, um beim Klick auf
den Login-Button, den Logout-Button erscheinen zu lassen.
 
Zuletzt bearbeitet von einem Moderator:
Hi,
bitte bedenke ob du jetzt besser anchors oder buttons für dein Menü verwendest. Kleiner Tipp es fängt mit a an ;).
Um solchen Fehlern vorzubeugen kannst du deine Seite in Zukunft auch erstmal durch den Validator (http://validator.w3.org/) jagen.

Grüße
 
bitte keine Buttons in Anchors verschachteln. Syntaktisch gesehen entweder das eine oder das andere.

Nachdem ich die Anchors entfernt habe, funktionierte es plötzlich. :)

Um solchen Fehlern vorzubeugen kannst du deine Seite in Zukunft auch erstmal durch den Validator (http://validator.w3.org/) jagen.
Trotz allem wird dieses Markup von ihm erfolgreich als valide anerkannt :)
This document was successfully checked as XHTML 1.0 Strict!
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>...</title>
  </head>
  <body>
    <ul><li><a href="#"><button>test</button></a></li></ul>
  </body>
</html>
Siehe auch http://de.selfhtml.org/html/referenz/elemente.htm#inline_elemente mit den gültigen Inline-Elementen, ausgenommen das a-Element ;)
 
Okay, hab das jetzt nicht explizit getestet gehabt.
Unabhängig davon das man dies immer machen sollte war es jetzt nicht der beste Tipp in diesem Fall da wir ja nicht wussten nach welchem Doctype der Quellcode aufgebaut ist.
Bei HTML5 bekommst du einen Fehler :).

Aber das zeigt halt auch das die W3C-Regeln nicht immer syntaktische Grundlage haben.
Heißt jedes Element hat eine Bedeutung und eben durch die Regeln auch eine Verhaltenseigenschaft.
Das eine muss das andere nicht beeinflussen kann aber.

Grüße
 
Ich würde auch nicht zu dieser Konstellation greifen, aber wem's gefällt, ist bis HTML5 auf der validen Seite :D
______________
[edit]Tipp-Ex[/edit]
 
Zuletzt bearbeitet:
Ich stehe vor einem neuen Problem:

Ich habe für meine Webseiten das jQuery-Plugin eingebaut und kann einen Cookie erstellen, der einen Logout-Button erscheinen lässt,
sobald man sich eingeloggt hat.

Mittlwerweile ist meine Seite erweitert, so dass meine HTML-Seiten auch mit externen HTML-Seiten aus anderen Ordnern verlinkt sind.
Dummerweise wenn ich mich auf eine dieser externen HTML-Seiten von den anderen Ordnern befinde und ich auf "Logout" klicke, dann wird mein Cookie nicht gelöscht,
obwohl ich wirklich auf jeder, wirklich jeder HTML-Seite das jQuery-Plugin eingebunden habe, sowie die Funktion, die erst durch den Wert meines Cookies aktiviert wird.

Seltsamerweise, wenn ich mich nicht auf diesen externen HTML-Seiten befinde, dann kann ich mich ohne Probleme ausloggen und mein Cookie wird gelöscht.
Wisst ihr vielleicht, warum ich mein Cookie auf den externen HTML-Seiten nicht löschen kann?
 

Neue Beiträge

Zurück