✔ IE sagt: "Objekt erforderlich"

soezkan

soezkan

Erfahrenes Mitglied
Hallo zusammen,

ich bekomme da eine sehr hilflose Fehlermeldung nur beim IE (wie immer ;) ):
Hier mein JS Code:

HTML: 
function showlist(ulMainID, ulSubID) {
	var mySubObj = document.getElementById(ulSubID);
	var myMainObj = document.getElementById(ulMainID);

	if(mySubObj.style.visibility == "hidden") {
		mySubObj.style.visibility = "visible";
	}
	else{
		mySubObj.style.visibility = "visible";
	}

	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(document.getElementsByTagName("ul")[i].id != ulSubID) {
			if(i <= 7) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
		}
	}
}

Aus der Meldung (wie folgt) werde ich einfach nicht schlau:

Code: 
Meldung: Objekt erforderlich
Zeile: 5
Zeichen: 2
Code: 0
URI: http://localhost/js/navigation.js

Weiß jemand woran das liegen könnte?

Vielen 1000 Dank.

Viele Grüße
Soezkan
 
Moin Soezkan,

mal angenommen, die gemeldete Zeile stimmt, dann würde das bedeuten, dass es kein Element mit der besagten ID gibt.

Woran es wirklich hapert, könnte man am Besten sagen, wenn man die Sache Live vor Augen hat.
 
Danke schonmal für die Antwort.
Ich kann nichts live präsentieren, da alles hier lokal läuft im Moment.

Die Sache ist die: ich benutze das Script für die Steuerung einer Navigation, die bestimmte Bereiche (Listenelemente) ein- und ausblendet. Wenn die Seite neu geladen wird, dann gibt es keinen Fehler, erst beim Mouseover, will der ein Objekt.

Die Frage ist halt, welches Objekt? Und die andere Frage ist, welche das Problem wahrscheinlich lösen könnte, ist wie ich so ein Objekt u.U. schonmal vorinitialisiere?

Vielen, vielen Dank für mehr Tipps.

Liebe Grüße,
Soezkan
 
Hi,

soezkan hat gesagt.:
Die Frage ist halt, welches Objekt?
Zum Vergrößern anklicken....

Das müsstest Du schon selbst wissen. Der Funktion müssen 2 IDs von HTML-Elementen übergeben werden. Welche das sind, kann hier ja niemand wissen.

soezkan hat gesagt.:
Und die andere Frage ist, welche das Problem wahrscheinlich lösen könnte, ist wie ich so ein Objekt u.U. schonmal vorinitialisiere?
Zum Vergrößern anklicken....

Es müssen einfach die Elemente mit den IDs, die da übergeben werden existieren. Ohne Online-Beispiel oder Quellcode kann man aber nicht sagen, wo der Fehler liegt könnte. An der Funktion ist jedenfalls nichts zu sehen. Du könntest Dir auch per alert() mal ausgeben lassen, was da eigentlich übergeben wird.

LG
 
soezkan hat gesagt.:
Und die andere Frage ist, welche das Problem wahrscheinlich lösen könnte, ist wie ich so ein Objekt u.U. schonmal vorinitialisiere?
Zum Vergrößern anklicken....

Naja, du hast ja das Objekte(die Variablen) ansich "initialisiert".
Code: 
var mySubObj = document.getElementById(ulSubID);
var myMainObj = document.getElementById(ulMainID);

Der Zugriff auf diese Variablen verursacht keinen Fehler.
Sofern aber die HTML-Elemente nicht existieren, verursacht der Zugriff auf deren style-Eigenschaft den Fehler.

getElementById() liefert im Erfolgsfall einen Zeiger auf das HTML-Element, und im Fehlerfall "false".
Du könntest also, bevor du auf die Variablen zugreifst, prüfen, ob diese "wahr" sind, alse einen Wert enthalten, der dem booleschen "true" entspricht, was der Fall ist, wenn das betreffende HTML-Element existiert.
 
Danke schonmal für die Antwort.
Das komische ist eben, dass ich nicht weiß, welches Objekt er nicht finden kann, denn wenn die Seite neu geladen wurde, dann ist da ja kein Fehler, erst wenn ich über die Menüpunkte fahre :(

Hier ist das HTML (sehr langer Code, tut mir leid :-( , das CSS erspare ich euch ;) ):

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Meine Seite</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="description" content="">
<link rel="stylesheet" type="text/css" href="meinstyle.css">
<!--[if IE 8]>
<style type="text/css">img#horizontal_navi_divider {
position: relative; 
z-index: 100; 
left: 0; 
top: 26px;
width: 938px;
height: 1px;
}</style>
<![endif]-->
<script type="text/javascript" src="js/navigation.js"></script>
</head>
<body>

<div id="Container">

	<div id="LeftBox" onMouseover="hidemenu('first')">&nbsp;</div>

	<div id="RightBox" onMouseover="hidemenu('first')"><img id="vertical_right_line" src="images/vertical_right_line.jpg" alt=""></div>

	<div id="ContentBox">
		<div id="Header" onMouseover="hidemenu('first')"><a href="startseite.php"><img id="toprightlogo" src="images/logo.jpg" alt="Grooveyard Berlin"></a></div>

		<div id="HeaderNavigation">
				<ul id="menu">
	<li id="first" class="first_active" onmouseover="showlist('first', 'list1', 'first')" onMouseout="fallback('first')"><a href="startseite.php">Link1</a>

		<ul id="list1">
		</ul>
		<br />
	</li>
	<li id="second" class="second" onmouseover="showlist('second', 'list2', 'first')" onMouseout="fallback('first')"><a href="a.php">Link2</a>
		<ul id="list2" onMouseout="hidemenu('first')">
			<li class="second"><a class="subsecond" href="a.php" title="">Unterlink1</a></li>
			<li class="second"><a class="subsecond" href="b.php" title="">Unterlink2</a></li>

			<li class="second"><a class="subsecond" href="c.php" title="">Unterlink3</a></li>
		</ul>
		<br />
	</li>
	<li id="third" class="third" onmouseover="showlist('third', 'list3', 'first')" onMouseout="fallback('first')"><a href="d.php">Link3</a>
		<ul id="list3">
		</ul>
		<br />

	</li>
	<li id="fourth" class="fourth" onmouseover="showlist('fourth', 'list4', 'first')" onMouseout="fallback('first')"><a href="e.php">Link4</a>
		<ul id="list4" onMouseout="hidemenu('first')">
			<li class="fourth"><a class="subfourth" href="e.php" title="">Unterlink1</a></li>
			<li class="fourth"><a class="subfourth" href="g.php" title="">Unterlink2</a></li>
		</ul>
		<br />

	</li>
	<li id="fifth" class="fifth" onmouseover="showlist('fifth', 'list5', 'first')" onMouseout="fallback('first')"><a href="h.php">Link5</a>
		<ul id="list5" onMouseout="hidemenu('first')">
			<li class="fifth"><a class="subfifth" href="h.php" title="">Unterlink1</a></li>
			<li class="fifth"><a class="subfifth" href="i.php" title="">Unterlink2</a></li>
			<li class="fifth"><a class="subfifth" href="j.php" title="">Unterlink3</a></li>
			<li class="fifth"><a class="subfifth" href="k.php" title="">Unterlink4</a></li>

		</ul>
		<br />
	</li>
	<li id="sixth" class="sixth" onMouseout="fallback('first')">
		<ul id="list6">
		</ul>
		<br />
	</li>
	<li id="seventh" class="seventh" onmouseover="showlist('seventh', 'list7', 'first')" onMouseout="fallback('first')"><a href="l.php">Link6</a>

		<ul id="list7" onMouseout="hidemenu('first')">
			<li class="seventh"><a class="subseventh" href="l.php" title="">Unterlink1</a></li>
			<li class="seventh"><a class="subseventh" href="m.php" title="">Unterlink2</a></li>
		</ul>
		<br />
	</li>
	</ul>
	<img id="horizontal_navi_divider" src="images/horizontal_bottom_inv_line.jpg" alt="">		</div>

		<div id="Content">
			<div id="LeftColumn">
			<p id="LeftImage"><img id="left_image" src="images/whitespacer.gif" alt=""></p>
			<p id="LeftMenu_startseite">Hallo</p>
			</div>	
			<div id="RightColumn">
			<h1>Hallo</h1>
			<p><br />
			Sed ac arcu diam, eget eleifend sapien. Donec ac elit in metus bibendum egestas non ut dui? Quisque odio massa, ullamcorper non egestas convallis, pretium sed metus. Suspendisse consectetur metus quis sapien volutpat et laoreet augue consequat! Sed condimentum auctor nisi, eget tristique tortor condimentum ut.
			</p>
			</div>	
		</div>

		<div id="Spacer"><img class="horizontal_lines" src="images/horizontal_bottom_line.jpg" alt=""></div>

		<div id="FooterNavigation">
				<img class="horizontal_lines" src="images/horizontal_bottom_line.jpg" alt="">
			<ul>

				<li><a href="#">Agb</a></li>
				<li><a href="#">Disclaimer</a></li>
				<li><a href="sitemap.php">Sitemap</a></li>
				<li><a href="impressum.php">Impressum</a></li>
				<li><a href="kontakt.php">Kontakt</a></li>

			</ul>			
		</div><img src="images/horizontal_bottom_line.jpg" width="100%" height="1" border="0" alt="">
	</div>

	<div style="clear: both;">&nbsp;</div>

</div>

</body>
</html>


Wichtig zu wissen, ist das der dritte Parameter, der an die Funktion showlist()
übergeben wird und der erste Parameter, der an die anderen beiden Funktionen hidemenu() und fallback() übergeben wird, vom PHP aus dort hineingeschrieben wird: nämlich der Name der aktuell angezeigten Seite.

Der JS Code hat sich seither auch etwas verändert, trotzdem ist der Fehler geblieben. Hier der aktuelle JS Code (navigation.js):

Code: 
function showlist(ulMainID, ulSubID, active){

	var myMainObj = document.getElementById(ulMainID);
	var mySubObj = document.getElementById(ulSubID);
	var myActiveObj = document.getElementById(active); 

	switch(active) {
		case "first":
			var activeSub = "list1_active";
			break;
		case "second":
			var activeSub = "list2_active";
			break;
		case "third":
			var activeSub = "list3_active";
			break;
		case "fourth":
			var activeSub = "list4_active";
			break;
		case "fifth":
			var activeSub = "list5_active";
			break;
		case "sixth":
			var activeSub = "list6_active";
			break;
		case "seventh":
			var activeSub = "list7_active";
			break;
	}

	var myActiveSubObj = document.getElementById(activeSub); 

	if(mySubObj.style.visibility == "hidden"){
		mySubObj.style.visibility = "visible";
	}
	else{
		mySubObj.style.visibility = "visible";
	}

	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(document.getElementsByTagName("ul")[i].id != ulSubID) {
			if(i <= 7) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
		}
	}
}

function hidemenu(active) {
	var myActiveObj = document.getElementById(active);

	switch(active) {
		case "first":
			var activeSub = "list1_active";
			break;
		case "second":
			var activeSub = "list2_active";
			break;
		case "third":
			var activeSub = "list3_active";
			break;
		case "fourth":
			var activeSub = "list4_active";
			break;
		case "fifth":
			var activeSub = "list5_active";
			break;
		case "sixth":
			var activeSub = "list6_active";
			break;
		case "seventh":
			var activeSub = "list7_active";
			break;
	}

	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(i <= 7 && document.getElementsByTagName("ul")[i].id != activeSub) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
	}

	document.getElementById(activeSub).style.visibility = "visible";
}

function fallback(active) {
	var myActiveObj = document.getElementById(active);

	switch(active) {
		case "first":
			var activeSub = "list1_active";
			break;
		case "second":
			var activeSub = "list2_active";
			break;
		case "third":
			var activeSub = "list3_active";
			break;
		case "fourth":
			var activeSub = "list4_active";
			break;
		case "fifth":
			var activeSub = "list5_active";
			break;
		case "sixth":
			var activeSub = "list6_active";
			break;
		case "seventh":
			var activeSub = "list7_active";
			break;
	}

	document.getElementById(activeSub).style.visibility = "visible";
}

Bitte nicht schimpfen, habe mir echt einen abgebrochen als JS-Amateur.

Vielen Dank auf jeden Fall für einen Tipp!

Liebe Grüße
Soezkan
 
Hi,

Du setzt in den Funktionen eine Variable activeSub auf "listX_active" und versuchst dann per getElementById(), das HTML-Element mit der ID activeSub anzusprechen. Es gibt in Deinem HTML-Dokument aber keine Elemente, die eine solche ID haben. Da hast du wohl was vergessen? Übrigens spuckt Firebug da natürlich auch jede Menge Fehlermeldungen (und die sind dann auch aussagekräftig). ;)

BTW kann man so ein Menü auch ohne Javascript rein über CSS umsetzen.

LG
 
Danke für die Antwort.

Also das Problem ist, dass sich die Struktur der Listen verändert. Und manchmal, geht man auf eine andere php-Datei, bekommt eine entsprechende UL-Liste eine neue ID, damit sie immer sichtbar bleibt, also "listX_active", wie z.B.

HTML: 
	<li id="fourth" class="fourth_active" onmouseover="showlist('fourth', 'list4', 'fourth')" onMouseout="fallback('fourth')"><a href="e.php">H&ouml;rbeispiele</a>
		<ul id="list4_active" onMouseout="hidemenu('fourth')">
			<li class="fourth_active"><a class="subfourth" href="e.php" title="">mit</a></li>
			<li class="fourth"><a class="subfourth" href="g.php" title="">ohne</a></li>
		</ul>
		<br />

	</li>


Das bedeutet, ich brauche die Zuweisungen in den Switches um das Menü zu steuern.

Was ich nicht kapiere, welches Objekt gemeint ist? Oder kann man dann irgendwie den Objekten schonmal einen "Nullwert" zuweisen? :rolleyes:
Fällt Dir vielleicht trotzdem noch was ein hierzu?

Und wenn Du das mit CSS ansprichst: ich habe zuerst eine CSS-Navi probiert, die aber gestreikt hat, da ich zwischen Haupnavi und Subnavi zum "Verzieren" eine Linie gesetzt habe. Die beiden Navigationen sind somit voneinander getrennt => Man konnte in der CSS-Version nichts in der Subnavi auswählen, darum JS.

Danke schonmal!
 
Ich habs gelöst :-) Hurra!

Es lag an daran, das ich die Objekte nicht richtig verglichen habe in

Code: 
	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(document.getElementsByTagName("ul")[i].id != ulSubID) {
			if(i <= 7) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
		}
	}


Das habe ich jetzt mal geändert und der neue Code sieht wie folgt aus (Objekte werden richtig verglichen, siehe Bspw. in for-Schleife:


Code: 
function showlist(ulMainID, ulSubID, active){
//alert(ulMainID + ", " + ulSubID + ", " + active);
	var myMainObj = document.getElementById(ulMainID);
	var mySubObj = document.getElementById(ulSubID);
	var myActiveObj = document.getElementById(active); 

	if(mySubObj.style.visibility == "hidden"){
		mySubObj.style.visibility = "visible";
		mySubObj.style.zIndex = 111;
	}
	else{
		mySubObj.style.visibility = "visible";
		mySubObj.style.zIndex = 111;
	}

	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(document.getElementsByTagName("ul")[i].id != mySubObj.id) {
			if(i <= 7) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
		}
	}
}

function hidemenu(active) {
	var myActiveObj = document.getElementById(active);

	switch(active) {
		case "first":
			var activeSub = "list1_active";
			break;
		case "second":
			var activeSub = "list2_active";
			break;
		case "third":
			var activeSub = "list3_active";
			break;
		case "fourth":
			var activeSub = "list4_active";
			break;
		case "fifth":
			var activeSub = "list5_active";
			break;
		case "sixth":
			var activeSub = "list6_active";
			break;
		case "seventh":
			var activeSub = "list7_active";
			break;
	}

	var myActiveSubObj = document.getElementById(activeSub);

	for(var i = 1; i < document.getElementsByTagName("ul").length; i++) {
		if(i <= 7 && document.getElementsByTagName("ul")[i].id != myActiveSubObj.id) document.getElementsByTagName("ul")[i].style.visibility = "hidden";
	}

	document.getElementById(activeSub).style.visibility = "visible";
}

function fallback(active) {
	var myActiveObj = document.getElementById(active);

	switch(active) {
		case "first":
			var activeSub = "list1_active";
			break;
		case "second":
			var activeSub = "list2_active";
			break;
		case "third":
			var activeSub = "list3_active";
			break;
		case "fourth":
			var activeSub = "list4_active";
			break;
		case "fifth":
			var activeSub = "list5_active";
			break;
		case "sixth":
			var activeSub = "list6_active";
			break;
		case "seventh":
			var activeSub = "list7_active";
			break;
	}

	var myActiveSubObj = document.getElementById(activeSub);

	myActiveSubObj.style.visibility = "visible";
}


Vielen Dank für die tolle Hilfe auf jeden Fall :)

Grüße!
Soezkan
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück