Træ-menu virker ikke

Der skal ikke stå "var" i funktionsdefinitionen. Altså bare "function openMenu(element)". Og så skal du selvfølgelig parse et eksisterende ID ind i funktionen.

Okay, har fjernet var i funktionsdefinitionen, men nu vil den slet ikke reagere når jer klikker på menupunktet.

Min kode i menuen ser således ud (php):

print "<table class=\"hovedMenu\" id=\"HovedMenu\" cellspacing=\"0\">";

print "<tr><td class=\"tdleft\" onclick=\"openMenu('Nyheder')\">Nyheder";
print "<span class=\"undermenu\" id=\"Nyheder\">
- <a href=\"?pid=1\">* About Us</a><br>
- <a href=\"?pid=2\">* Awards</a><br>
- <a href=\"?pid=3\">* Future Plans</a><br>
- <a href=\"?pid=4\">* Staff</a><br>
</span></td></tr>";
print "</table>";

og så rettede jeg min javascript-kode til følgende:

function openMenu(element)
{
    var objekt = document.getElementById(element);
   
    if (objekt.style.display != "none")
    {
        objekt.style.display = "none";
    }
    else
    {
        objekt.style.display = "";
    }
}

Sikkert fordi du sætter værdien i dit style-sheet, hvis du trykker to gange hjælper det nok !-)

-- men gør i stedet sådan:

<style type="text/css">
.undermenu{display:none;}
</style>

<script type="text/javascript">
function openMenu(element){
  var objekt = document.getElementById(element);
   
  if (objekt.style.display != "block"){
    objekt.style.display = "block";
  }else{
    objekt.style.display = "none";
  }
}
</script>

<table class="hovedMenu" id="HovedMenu" cellspacing="0">

<tr><td class="tdleft" onclick="openMenu('Nyheder')" style="cursor:pointer">Nyheder
<div class="undermenu" id="Nyheder">
- <a href="?pid=1">* About Us</a><br>
- <a href="?pid=2">* Awards</a><br>
- <a href="?pid=3">* Future Plans</a><br>
- <a href="?pid=4">* Staff</a><br>
</div></td></tr>
</table>

-- og funktionen kan forkortes en del ved at:

<script type="text/javascript">
function openMenu(element){
  var objekt = document.getElementById(element).style;
  objekt.display = objekt.display != "block" ? objekt.display = "block": objekt.display = "none";
}
</script>

Tak for hjælpen roenving. Det jeg ikke forstår er, at nogle bruger 'block' i stedet for bare '' som jeg har læst skulle være nok, sådan at forstå, at står der alt andet end 'none' så ville elementet blive vist:)

Men du skal jo have dine point:)

Jeg vil altid selv i den slags situationer bruge en explicit benævnt værdi, derfor "block" ...

-- men faktisk er det sådan, at sætter du en værdi via script til ingenting ("") vil den blive det, som den ellers ville skulle have været, hvis ikke der havde været noget script inde over, men i dette tilfælde giver det ikke mening at forvente andre værdier end "block" og så synes jeg at koden er adskilligt nemmere at gennemskue !-)

-- hvis man skal arbejde med f.eks. forskellige farver i baggrund e.l. er der masser af god grund til at udnytte den funktionsmåde, men så er der jo også 16,7 mio. muligheder, her er der præcis 2 !o]

-- iøvrigt skal du selvfølgelig lægge mærke til, at jeg bruger en div, hvorfor det skal hedde block og ikke inline ...

-- og indgangsvinklen med den negative forespørgsel vil i stort set alle tilfælde give det rigtige resultat, når du spørger negativt på det positive resultat (display != "block" !-), men sjældent det rigtige ved at spørge negativt på det negative, for så vil den værdi, der kan aflæses fra javascript først blive sat ved første gennemløb, så den funktion, man ønsker, først forekommer ved andet tryk !o]

-- og gaaab, jeg så lige en håbløshed i min forkortede udgave, den skal selvfølgelig se således ud:

<script type="text/javascript">
function openMenu(element){
  var objekt = document.getElementById(element).style;
  objekt.display = objekt.display != "block" ? "block" : "none";
}
</script>

-- els velbekomme '-)

-- og tak for point ;~}

Så lidt og mange tak for hjælpen:)

Men når jeg klikker på et af linksene i undermenuerne, klapper menuen sammen igen, hvordan undgår jeg det?

Så skifter siden jo også !-)

-- hvis andre dele af din side skifter (i f.eks. (i)frames !-) kan du:

<style type="text/css">
.undermenu{display:none;cursor:default;}
.hovedMenu{cursor:pointer;border-collapse:collapse;}
.hovedMenu td{margin:0;padding:0;}
</style>

<script type="text/javascript">
function openMenu(element){
  var objekt = document.getElementById(element).style;
  objekt.display = objekt.display != "block" ? "block" : "none";
}
</script>


<table class="hovedMenu" id="HovedMenu">

<tr><td class="tdleft" onclick="openMenu('Nyheder')">Nyheder
<div class="undermenu" id="Nyheder" onclick="event.cancelBubble=true;">
- <a href="java script:void(0)">* About Us</a><br>
- <a href="?pid=2">* Awards</a><br>
- <a href="?pid=3">* Future Plans</a><br>
- <a href="?pid=4">* Staff</a><br>
</div></td></tr>
</table>

-- hvis siden faktisk skifter fuldstændigt, skal du over i en cookie-løsning eller lave noget server-side !-)

-- en cookie-ting kan du se her: http://www.eksperten.dk/spm/650612 !o]