Verlinkungsproblem

diano

Mitglied
Hallo Leute,

ich bin noch etwas neu auf dem Gebiet und deshalb hoffe ich, dass ihr mir helfen könnt. Ich habe mir ein kleines Script nach verschiedenen Tutorials gebaut und es funktioniert zu, sagen wir mal, 98 %. Das Problem ist, dass ich die Hauptordner Home, Unternehmen, Leistungsprofil, Service, Kontakt, Impressum nicht verlinken kann! Die Unterordner der jeweiligen Hauptordner lassen sich problemlos mit "a href" verlinken. Woran könnte das liegen, das sich die Hauptordner nicht verlinken lassen. Wäre super, wenn mir jemand weiterhelfen könnte.

Code:
<script type="text/javascript">
<!--
function outline(id)
{
 if(document.getElementById(id).style.display == 'none')
 {
  document.getElementById(id).style.display = 'block';
 }
 else
 {
  document.getElementById(id).style.display = 'none';
 }
}
//-->
</script>
Code:
      <p><b>Home</b></p>
      <p><a href="#" onclick="outline('Unternehmen'); return false;"><b>Unternehmen</b></a><br>
        <span id="Unternehmen" style="display:none">
        &nbsp;&nbsp;&nbsp;<a href="Zertifikat.htm">Zertifikat</a><br>
        &nbsp;&nbsp;&nbsp;Referenzen<br>
        &nbsp;&nbsp;&nbsp;Equipment<br>
        &nbsp;&nbsp;&nbsp;Partner</span></p>      
      <p><a href="#" onclick="outline('Leistungsprofil'); return false;"><b>Leistungsprofil</b></a><br>
        <span id="Leistungsprofil" style="display:none">
        &nbsp;&nbsp;&nbsp;Ingenieurvermessung<br>
        &nbsp;&nbsp;&nbsp;<a href="#" onclick="outline('Leistungsprofil_Hydrographie'); return false;">Hydrographie</a><br>
        <span id="Leistungsprofil_Hydrographie" style="display:none">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Offshore<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Onshore<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Messschiffe</span> 
        &nbsp;&nbsp;&nbsp;3D-Laserscanning<br>
        &nbsp;&nbsp;&nbsp;GIS</span></p>      
      <p><a href="#" onclick="outline('Service'); return false;"><b>Service</b></a><br>
        <span id="Service" style="display:none">
        &nbsp;&nbsp;&nbsp;Gerätevermietung<br>
        &nbsp;&nbsp;&nbsp;Download<br>
        &nbsp;&nbsp;&nbsp;Links</span></p>      
      <p><a href="#" onclick="outline('Kontakt'); return false;"><b>Kontakt</b></a><br>
        <span id="Kontakt" style="display:none">
        &nbsp;&nbsp;&nbsp;Ansprechpartner<br>
        &nbsp;&nbsp;&nbsp;Stellenangebote<br>
        &nbsp;&nbsp;&nbsp;<a href="Anfahrt.htm">Anfahrt</a></span></p>      
      <p><a href="#" onclick="outline('Impressum'); return false;"><b>Impressum</b></a><br>
 
Hi,

das Verlinken ist kein Problem - entferne einfach in den onclick-Events die Anweisungen return false.

Allerdings werden dann die Seiten neu geladen, was zur Folge hat, dass der aktuelle Zustand des Menüs verloren geht. Du müsstest Dir also eine Möglichkeit überlegen, den Zustand zu übergeben (Cookies oder ähnliches).

Ciao
Quaese
 
Im Prinzip will ich das Menü so realisieren wie bei GMX auf der Seite. Wie kann ich denn die Cookies übergeben?
 
Hi,

Informationen zu Cookies findest Du hier.

Du kannst folgendermassen vorgehen. Wird ein Menüpunkt geöffnet, schreibst Du einen Cookie, der als Wert die ID des geöffneten Punktes erhält. Wird das Dokument erneut geladen, testest Du im onload-Event, ob ein entsprechender Cookie existiert und rufst mit der ausgelesenen ID die Funktion outline auf.

Ciao
Quaese
 
Könntest du vielleicht auch ein Codebeispiel dafür geben? Das ist für mich echt völliges Fachchinesisch. :confused:
 
Hi,

folgendes Dokument besitzt alle notwendigen Funktionen - Cookie setzen, Cookie löschen, Cookie auslesen
und prüfen, ob Cookies unterstützt werden.

Soll der Zustand des Menüs in der Folgeseite wieder hergestellt werden, so muss dort die Überprüfung auf
den Cookie erfolgen. Im Beispiel habe ich im Menüpunkt "Unternehmen" das Dokument selbst wieder
aufgerufen (datei.html).

datei.html:
Code:
<?xml version="1.0" encoding="iso-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese" />
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

<script type="text/javascript">
<!--
function outline(id){
	if(document.getElementById(id).style.display == 'none'){
	  // Cookie setzen
	  setCookie("menue", id, 86400000);
		document.getElementById(id).style.display = 'block';
	}else{
		document.getElementById(id).style.display = 'none';
	  // Cookie löschen
	  eraseCookie("menue");
	}

}

// +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

/* *********************** Funktion zum Setzen eines Cookies *************************** *
 * Parameter:                                                                            *
 * strName     - Bezeichnung für die Cookievariable                                      *
 * varWert     - Wert, welcher der Cookievariablen zugewiesen werden soll                *
 * longExpires - Gültigkeitsdauer des Cookies in Millisekunden                           *
 * ************************************************************************************* */
	function setCookie(strName, varWert, longExpires){
  	// Datumsobjekt mit aktuellen Werten anlegen
  	var dateExpires = new Date();
    // Zeitpunkt der Ungültigkeit des Cookies berechnen
		dateExpires = new Date(dateExpires.getTime() + longExpires);
    // In gültiges Datum umwandeln
    dateExpires.setTime(dateExpires);
    // Datum in GMT-String umwandeln
    dateExpires = dateExpires.toGMTString();

    // Cookie-Variable anlegen
	  var strCookie = strName + "=" + unescape(varWert);
	  strCookie += (longExpires) ? "; expires=" + dateExpires 	: "";
	  document.cookie = strCookie;
	}

/* ******************* Löschen eines Cookies ******************** *
 * Parameter:                                                     *
 * strName   - Name der Cookievariablen, die gelöscht werden soll *
 * ************************************************************** */
	function eraseCookie(strName){
  	// Datumsobjekt instanziieren, das in der Vergangenheit liegt (01.01.1970, 00:00:01 Uhr)
  	var dateExpires = new Date(1970, 0, 1, 0, 0, 1);
    // Datum in GMT-String umwandeln
    dateExpires = dateExpires.toGMTString();

  	// Cookie ein Datum in der Vergangenheit zuweisen
	  var strCookie = strName + "=; expires="+dateExpires;
	  document.cookie = strCookie;
	}

/* ********************* Cookie auslesen *********************************** *
 * Der Wert zur Variablen strName wird zurückgegeben                         *
 * Parameter: strName - Name der Variablen, deren Wert ermittelt werden soll *
 * ************************************************************************* */
  function getCookie(strName){
	  var i = 0  //Suchposition im Cookie
	  var strSuche = strName + "=";

	  // Solange das Ende des CookieStrings noch nicht erreicht wurde
	  while(i < document.cookie.length){
	    // Falls der Name des Cookies gefunden wurde
	    if (document.cookie.substring(i, i+strSuche.length) == strSuche){
      	// Suche nach dem ersten Semikolon ab dem Auftreten des Cookie-Namens
	      var intEnde = document.cookie.indexOf(";", i+strSuche.length);
        // Stringlänge des Cookie-Wertes ermitteln
	      intEnde = (intEnde > -1) ? intEnde : document.cookie.length;
        // Cookie-Wert auslesen
	      var strCookie = document.cookie.substring(i+strSuche.length, intEnde);
      	// Zeichen aus der URL-Schreibweise wieder zurückwandeln und zurückgeben
	      return unescape(strCookie);
	    }
	    // Position im Cookie-String inkrementieren
	    i++;
	  }
	  return null;
  }

/* ************* Testen, ob Browser Cookies zulässt *********************** *
 * Rückgabe: true, falls Unterstützung von Cookies, false sonst             *
 * ************************************************************************ */
	function checkCookie(){
  	// Versuch, einen Cookie zu setzen
	  setCookie("CookieTest", "OK");
    // Falls der Cookie nicht gesetzt werden konnte
	  if (!getCookie("CookieTest"))
	    return false;
	  else{
	    eraseCookie("CookieTest");	// Cookie wieder löschen
	    return true;
	  }
	}

  window.onload = function(){
  	if(checkCookie() && (getCookie("menue").length > 0)){

	    outline(getCookie("menue"));
    }
  }
//-->
</script>

</head>
<body>
      <p><b>Home</b></p>
      <p><a href="datei.html" onclick="outline('Unternehmen');"><b>Unternehmen</b></a><br>
        <span id="Unternehmen" style="display:none">
        &nbsp;&nbsp;&nbsp;<a href="Zertifikat.htm">Zertifikat</a><br>
        &nbsp;&nbsp;&nbsp;Referenzen<br>
        &nbsp;&nbsp;&nbsp;Equipment<br>
        &nbsp;&nbsp;&nbsp;Partner</span></p>
      <p><a href="#" onclick="outline('Leistungsprofil');"><b>Leistungsprofil</b></a><br>
        <span id="Leistungsprofil" style="display:none">
        &nbsp;&nbsp;&nbsp;Ingenieurvermessung<br>
        &nbsp;&nbsp;&nbsp;<a href="#" onclick="outline('Leistungsprofil_Hydrographie');">Hydrographie</a><br>
        <span id="Leistungsprofil_Hydrographie" style="display:none">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Offshore<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Onshore<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Messschiffe</span>
        &nbsp;&nbsp;&nbsp;3D-Laserscanning<br>
        &nbsp;&nbsp;&nbsp;GIS</span></p>
      <p><a href="#" onclick="outline('Service');"><b>Service</b></a><br>
        <span id="Service" style="display:none">
        &nbsp;&nbsp;&nbsp;Gerätevermietung<br>
        &nbsp;&nbsp;&nbsp;Download<br>
        &nbsp;&nbsp;&nbsp;Links</span></p>
      <p><a href="#" onclick="outline('Kontakt');"><b>Kontakt</b></a><br>
        <span id="Kontakt" style="display:none">
        &nbsp;&nbsp;&nbsp;Ansprechpartner<br>
        &nbsp;&nbsp;&nbsp;Stellenangebote<br>
        &nbsp;&nbsp;&nbsp;<a href="Anfahrt.htm">Anfahrt</a></span></p>
      <p><a href="#" onclick="outline('Impressum');"><b>Impressum</b></a><br>
</body>
</html>
Vielleicht hilft Dir das weiter.

Ciao
Quaese
 
Zurück