Über Methode mit innerHTML Div verändern (funktioniert nicht)

1chris · #1 (**permalink**) 26.03.2010, 12:41

EDIT: Sehe gerade, das mein Theard im CSS Bereich gelandet ist und nicht im JS - habe da vermutlich gepennt. Kann ein Mod bitte den Theard verschieben? Sorry & danke!

Hi,

ich fange gerade damit an, endlich mal JS zu lernen. Mein Problem ist vermutlich recht simpel, aber ich komme leider nicht drauf.

Erstmal mein Quellcode (recht vereinfacht):

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
	<script type="text/javascript">
		<!--
			function test () {
				this.machwas = function () {
					alert ( "Hi");
					document.getElementById( 'lustiges_div' ).align="right";
					document.getElementById( 'lustiges_div' ).innerHTML = "hans in glueck";
				}
			}
			var hans = new test ();
			function doit () {
				//document.getElementById( 'lustiges_div' ).innerHTML = "hans in glueck";
				document.getElementById( 'lustiges_div' ).innerHTML = hans.machwas();
			}
		-->
	</script>
</head>

<body onload="doit()">
	<div id="lustiges_div" style="width:100px;height:100px;background:#CFC;"><p>hans im pech</p></div>
</body>
</html>

Wieso kann ich aus dem Object "test", über seine Methode "machwas" innerHTML auf das "lustige_div" anwenden? Richtig ansprechen tue ich es ja (align funktioniert) und mein Code ist auch fehlerfrei (beim onload in der Function "doit" funktioniert es ja auch).

Vermutlich mache ich einen grundlegenden Fehler oder ähmliches, wäre euch dankbar für Hilfe

protonenbeschleuniger · #2 (**permalink**) 26.03.2010, 13:50

Du musst nicht weiter rumrätseln. In den meisten Browsern gibt es eine Fehlerkonsole, dort stehen die Fehler drin. Schau mal nach!

EDIT: Ich seh grad, es gibt keinen Fehler. Aber was soll das:
document.getElementById( 'lustiges_div' ).innerHTML = hans.machwas();

1chris · #3 (**permalink**) 26.03.2010, 14:26

Naja mit document.getElementById( 'lustiges_div' ).innerHTML = hans.machwas(); will ich lediglich die vorher zugewiesende Mehtode ausführen - was ja auch funktioniert, allerdings bleibt das innerHTML ohne Wirkung bzw es hat nicht den selben Effeckt, wie wenn ich es aus einer normalen Funktion aufrufe.

Sicherlich geht es bei dem Beispie wesentlich simpler, allerdings habe ich auch das meiste vom Code rausgenommen. Letzendlich spreche ich das lustige div auch nicht direkt an, sondern über ein Array - aber das ist ja vermutlich nebensächlich und wurde den Codeschnipsel nur aufblasen

Walter IT-Services · #4 (**permalink**) 28.03.2010, 01:12

Hallo!

Mach das daraus:

HTML-Code:

this.machwas = function () {
return 'Mach was';
}

Du hast hier eine Zuweisung drin:

HTML-Code:

document.getElementById( 'lustiges_div' ).innerHTML = hans.machwas();

hans.machwas() gibt aber gar nichts zurück.
Ergo hast du mit der Funktion den Inhalt von "lustiges_div" verändert und durch die Zuweisung von der Funktion, die nichts zurückgibt, hast du den Inhalt dann auf "nichts" gesetzt.
Ich hoffe, du verstehst, was ich meine...

Noch mal Klartext:

Code:

document.getElementById( 'lustiges_div' ).innerHTML = hans.machwas();


hat die gleiche Auswirkung wie:


document.getElementById( 'lustiges_div' ).innerHTML = '';

1chris · #5 (**permalink**) 28.03.2010, 11:05

Danke für deine Antwort, hatte den Theard nochmal in richtigen Bereich erstellt (muss beim ersten mal gepennt haben). Hatte bereits mein Dusselfehler gefunden aber nur im JS Bereich nochmal reongepostet. Aber dennoch danke für deine Antwort

Walter IT-Services · #6 (**permalink**) 28.03.2010, 14:47

Hatte mich schon gewundert, was das im CSS zu suchen hat.

Bitte schreib beim nächsten mal wenigstens in den alten Thread, dass du einen neuen aufgemacht hast.

1chris · #7 (**permalink**) 28.03.2010, 15:09

Läasst sich machen, hatte in eröffnungspost zwar ein Mod gebeten den Theard zu verschieben - dabei ist es aber auch geblieben ^^

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Div mit PHP-Inhalt. height: auto; funktioniert nicht.	arosarius	CSS	2	04.05.2011 20:42
CSS Text-Postion innerhalb von einem DIV verändern	Dabinho	CSS	14	16.11.2009 08:36
Mouseover funktioniert nicht (externe Methode)	blackhtml	CSS	2	07.04.2009 17:49
relative hight bei div funktioniert nicht!	Michael84	CSS	3	29.12.2004 04:19
div funktioniert im IE aber nicht in NS 7.1	18inch	CSS	4	22.09.2004 14:29