nicht angemeldet
Wer kann mir bitte Helfen?
Ich habe ein vertikales JS-Menü, welches im Prinzip auch so funktioniert wie ich möchte. Bei diesem Menü ist ein Fehler den ich nunmehr seit Wochen nicht find, da ich leider immer noch JS Anfänger bin.
Dieses Menü ist so aufgebaut, dass mit Klick auf einen Hauptmenüpunkt die Untermenüs aufgehen und mit einem weiteren Klick die darunterliegenden Untermenüs aufgehen. Mit Klick auf eine höhere Ebene schließen sich die darunterliegenden Menüpunkte, oder bei Klick auf einen anderen Hauptmenüpunkt schließt sich der gesamte Verzeichnisbaum. Soweit funktioniert es auch, der Fehler ist folgender: es kann keine HTML-Datei angesprochen werden sofern Menüs Untermenüs haben, sind keine Untermenüs vorhanden so wird die Seite korrekt angezeigt.
Wo kann hier der Fehler liegen? Ich komme einfach nicht dahinter wo mein Fehler ist.
Es wäre für mich sehr wichtig, weil dieses Menü auf einer Vereinspage eingesetzt werden soll, die am Ende ca. 60 Seiten umfassen wird. Ein Menü ohne JS nur mit CSS aufzubauen bei der Menge an Seiten wäre ein wahnsinniger Aufwand, wenn neue Seiten eingefügt werden sollten.
Vielen Dank schon mal im Voraus für die Unterstützung.
Gruß
Thomas
hier mein Code
<html>
<head>
<title></title>
<script type="text/javascript">
window.onload=menu;
function menu(){
var l=document.getElementById('menu').getElementsByTagName('ul')
for(var i=0;i<l.length;i++){
l.item(i).style.display='none';
}
l=document.getElementById('menu').childNodes
for(i=0;i<l.length;i++){
if(l.item(i).tagName && l.item(i).tagName.toLowerCase()=='li'){
setEvent(l.item(i))
}
}
}
function setEvent(e){
var l=(e.getElementsByTagName('ul').item(0)) ? e.getElementsByTagName('ul').item(0).childNodes : ''
if(l.length>0){
e.onclick=function (){show(this);return false;}
for(i=0;i<l.length;i++){
if(l.item(i).tagName && l.item(i).tagName.toLowerCase()=='li'){
setEvent(l.item(i))
}
}
}
}
function show(e){
if(e.parentNode!=document.getElementById('menu')){
if(!document.getElementById('my_event')){
e.id='my_event'
e.getElementsByTagName('ul').item(0).style.display=(e.getElementsByTagName('ul').item(0).style.display=='none') ? 'block' : 'none'
}
}
else{
if(document.getElementById('my_event')){
document.getElementById('my_event').id=''
}
else e.getElementsByTagName('ul').item(0).style.display=(e.getElementsByTagName('ul').item(0).style.display=='none') ? 'block' : 'none'
}
}
//-->
</script>
</head>
<body>
<ul id="menu">
<li><a href="menuitem1.html">1. Menuitem</a>
</li>
<li><a href="menuitem2.html">2. Menuitem</a>
<ul>
<li><a href="submenu1.html">1. Submenu</a></li>
<li><a href="submenu2.html">2. Submenu</a></li>
</ul>
</li>
<li><a href="menuitem3.html">3. Menuitem</a>
<ul>
<li><a href="submenu3.html">3. Submenu</a>
<ul>
<li><a href="subsubmenu1.html">1. Subsubmenu</a></li>
<li><a href="subsubmenu2.html">2. Subsubmenu</a></li>
</ul>
</li>
<li><a href="submenu4.html">4. Submenu</a></li>
</ul>
</li>
<li><a href="menuitem4.html">4. Menuitem</a>
</li>
</ul>
</body>
</html>