Initialisierunsproblem mit JS[erledigt]

  • Themenstarter Themenstarter sw33tlull4by
  • Beginndatum Beginndatum
S

sw33tlull4by

Guest
Hallo!
Wenn man Funktionen mittels
...
<body onload="function()">
...
ausführt ist deren Ergebnis,sobald die Seite einsatzbereit ist, weg.
Wie kann ich das verhindern?

Aktuelles Problem:
Eine Liste mit mehreren Elemeneten,welchen ich eine Funktion zuweisen wollte, nur leider funktioniert das nicht so wie gedacht.
zZ ist meine LIste noch sehr klein und es ist deswegen eigentlich gut Möglich das so per hand zu machen aber bei grossen Listen wäre ich sehr dankbar wenn ich auf diese Weise getElementsByName benutzen könnte.
Code: 
<html>
<head>
<title>hiho</title>
<script language="Javascript" type="text/Javascript">
function noway(element){
document.getElementById("output").innerHTML = element.id;
}
function everyway(){
document.getElementById("output").innerHTML = "";
}
function initial(){
document.getElementById("output").onmouseover = "noway(this)";
document.getElementById("output").onmouseout = "everyway()";
}
</script>
</head>
<body onload="initial()">
<div id="stupid">HARHARHAR</div>
<div id="output"></div>
</body>
</html>

Das minimalbeispiel sollte funktionieren.
Was passiert ist das wenn ich über das Element stupid mit der Maus fahre nichts passiert.
Wenn ich den Code jedoch ändern würde in:
...
<div id="stupid" onmouseover="noway()" onmouseout="everyway()">harhar</div>
....

funktioniert es.

mfg

sw33t
 
Hallo, du musst die Events auch an #stupid anhängen, nicht an #output.
#output ist zu Beginn nicht sichtbar und empfängt deswegen kmeinen mouseover-event.

Außerdem: Events sind keine zeichenketten, sondern Funktionen. Du kannst bei der Zuweisung einen Funktionsnamen angeben (ohne Parameter) oder eine anonyme Funktion definieren:
Code: 
document.getElementById("stupid").onmouseover = function() { noway(document.getElementById("stupid")); };
document.getElementById("stupid").onmouseout = function() { everyway(); };

mfg, metax.
 
das mit den anonymen funktionen kannte ich bisher nur von anderen Programmiersprachen.danke.

b2t:
Das mit den Zeichenketten und dem output anstelle von stupid, waren schreibfehler, war sehr gar gestern abend.

Mein Problem bleibt bestehen.
Falls es hilft Browser ist FF3.5.3.

Hier mal der wichtigste Auszug aus dem gestesteten Code:

Code: 
<html>
	<head>
		<title>asdasd</title>
	</head>
	<script type="text/javascript" language="JavaScript">
		function noway( element){
			document.getElementById("output").innerHTML = element.id;
			document.getElementById("t"+element.id).style.backgroundColor ="black";
			
		}
		
		function everyway(){
			document.getElementById("output").innerHTML="";
			document.getElementById("one").style.backgroundColor ="white";
		}
		function initialize(){/* sowohl das nicht auskommentierete aus auch das auskommentierte der funktion funktioniert nicht
			var element = document.getElementsByName("link");
			for(var i in element){
				i.onmouseover = noway(this);

			}*/
			document.getElementById("four").onmouseover = noway(this);
		}
			
	
	
	
	</script>
	<body onload="initialize()">
		<div id="stupid" onmouseover="noway(this)" onmouseout="everyway()">Haha</div>
		<br> <br>
		<div id="output"></div>
		<div id="list">
			<ul>
				<li><a name="link" id="seven"  href="#">asasda</a></li>
				<li><a name="link" id="eight"  href="#">asdad</a></li>
			</ul>
			<ul>
				<li><a name="link" id="nine"   href="#">asdada</a></li>
				<li><a name="link" id="ten"    href="#">asdasd </a></li>
				<li><a name="link" id="eleven" href="#">sfsdfsd</a></li>
				<li><a name="link" id="twelve" href="#">asdasd</a></li>
			</ul>
		</div>
			<div id="tseven">
				hiih
			</div>
			<div id="teight">
				hoho
			</div>
			<div id="tnine">
				lala
			</div>
			<div id="tten">
				tada
			</div>
			<div id="televen">
				blub
			</div>
			<div id="ttwelve">
				bla
			</div>
	</body>
</html>
 
Hallo,

dein Code enthält mehrere Fehler, zum einen wird Deine Funktion gleich beim zuweisen aufgerufen, und zum anderen weiß dein Browser ja nicht, dass this eigentlich auf das Element zeigen soll.

Hier mal der angepasste JS Code:

Code: 
function noway(e) {
	e = (e) ? e : (window.event) ? window.event : "";
	var element = (e.target) ? e.target : e.srcElement;
	document.getElementById("output").innerHTML = element.id;
	document.getElementById("t"+element.id).style.backgroundColor ="black";
}
		
function everyway() {
	document.getElementById("output").innerHTML="";
	document.getElementById("one").style.backgroundColor ="white";
}
		
function initialize() {
	var element = document.getElementsByName("link");
			
	for(var i = 0; i < element.length; i++) {
		element[i].onmouseover = noway;
	}
}
 
Vielen dank für den angepassten JS Code.
Funktioniert nun, vielen dank.
Mfg

sw33t
 
Um antworten zu können musst du eingeloggt sein.
Zurück
Oben