eine Zweite Variabel definieren

[vsitor]

Hallo,

ich bastel gerade ein Dropdown Menü das mit Javascript funktioniert. Jetzt habe ich mit dem Befehl getElementById eine Funktion die NAV heisst (Navigation).
Wenn jemand mit der Mouse drüberfährt, klappt das Menü aus.

Nun kann ich kein zweites Script erstellen. Ich hätte gern noch die Variabel NAV2 und NAV3.

folgender Code wurde verwendet:

<script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
	if (document.all&&document.getElementById) {
		navRoot = document.getElementById("nav");
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI") {
				node.onmouseover=function() {
					this.className+=" over";
				}
				node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=startList;
//--><!]]></script>

Wenn ich im Script noch

	navRoot = document.getElementById("nav2");

einfüge, nimmt der immer nur das letzte Menü (NAV2) und das Erste geht nicht (NAV).

wie kann ich 2 Variabeln aufrufen, also NAV und NAV2? Hatte schon das hier probiert:

navRoot = document.getElementById("nav2")&&("nav");

aber das geht leider auch nicht....
Irgendwer einen Tipp?
Danke

 

[Sven Mintel]

Ich weiss nicht, ob ich dein Anliegen recht verstehe, aber probiere es mal, der Funktion das betreffende Element als Parameter beim Funktionsaufruf zu übergeben....bspw:

startList = function(navRoot) {

	if (document.all&&document.getElementById) {
		
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI") {
				node.onmouseover=function() {
					this.className+=" over";
				}
				node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=new Function('startList(document.getElementById("nav"))');

...so kannst du die Funktion für mehrere Elemente verwenden.

Willst du jetzt bspw. die Funktion beim onload für alle 3 Elemente aufrufen, geht das z.B. so:

navs=['nav','nav2','nav3'];

window.onload=function()
  {
    for(var k in navs)
      {
        startList(document.getElementById(navs[k]));
      }
  }

 

[vsitor]

Hallo und Danke,

ich werde es mal ausprobieren, im Moment habe ich eine Lösung gefunden, die wie folgt aussieht:

startList = function() {
	if (document.all&&document.getElementById)
	{
		navRoot = document.getElementById("nav");
		for (i=0; i<navRoot.childNodes.length; i++)
		{
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI")
			{
				node.onmouseover=function()
				{
					this.className+=" over";
				}
				node.onmouseout=function()
				{
					this.className=this.className.replace(" over", "");
				}
			}
		}

		nav2Root = document.getElementById("nav2");
		for (i=0; i<nav2Root.childNodes.length; i++)
		{
			node = nav2Root.childNodes[i];
			if (node.nodeName=="LI")
			{
				node.onmouseover=function()
				{
					this.className+=" over";
				}
				node.onmouseout=function()
				{
					this.className=this.className.replace(" over", "");
				}
			}
		}

		nav3Root = document.getElementById("nav3");
		for (i=0; i<nav3Root.childNodes.length; i++)
		{
			node = nav3Root.childNodes[i];
			if (node.nodeName=="LI")
			{
				node.onmouseover=function()
				{
					this.className+=" over";
				}
				node.onmouseout=function()
				{
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=startList;

Muss man das so umständlich machen, oder könnte man das auch anders lösen indem man zB in einer Zeile document.getElementById("nav3"); PLUS document.getElementById("nav2"); schreibt oder so ähnlich ...

Danke

 

[Sven Mintel]

Man muss es nicht so umständlich machen....sondern mit einer Schleife, welche den selben Funktionsabschnitt mehrfach durchläuft, allerdings jedes mal mit einem anderen navroot-Objekt.

Der letztere Teil meines Vorschlages(inkl. der kleinen Änderungen an der Funktion) tut dies(naja...fast).

Genau tun würde es dies:

startList = function() 
{

for(x=0;x<startList.arguments.length;++x)
	{	
	 
	  navRoot = document.getElementById(startList.arguments[x]);
		
		for (i=0; i<navRoot.childNodes.length; i++) 
		{
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI") 
			{
				node.onmouseover=function() 
				{
					this.className+=" over";
				}
				node.onmouseout=function() 
				{
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=new Function('startList("nav","nav2","nav3")');