✔ Problem mit onlick und Javascript Objekt

A

-André-

Erfahrenes Mitglied
Hallo,
ich habe folgendes Problem,
ich habe ein Objekt in JavaScript erstellt. Innerhalb einer Funktion möchte ich mehreren Elementen im HTML DOM ein on klick Event zuweisen.
Folgende Notation klappt ganz normal:
Code: 
element.onclick = this.onClickFunktion;
Ich möchte aber an die Funktion Parameter überweisen, deshalb habe ich versucht,
die Funktion so anzusprechen:
Code: 
element.onclick = function()
{
    this.onClickFunktion(wert);
}
Dann bekomme ich aber die Fehlermeldung, dass onClickFunktion keine Funktion sei.

Wie kann ich die Funktion onClickFunktion des Objekts ansprechen?


Gruß

-André-
 
Moin,

this bezieht sich im 2. Fall auf element und nicht auf das von dir erstellte Objekt, du müsstest das this also gegen den Namen des Objektes austauschen.
 
Hallo,
Danke für die schnelle Antwort,
ich habe this gegen Objektname.prototype ausgetauscht, Objektname ohne prototype klapp nicht. Aber jetzt funktionieren die "this" innerhalb von onClickFunktion nicht mehr, muss ich da auch Objektname.prototype verwenden, und wenn ja, warum?

Gruß
-André-
 
Hallo,
also

in einer Funktion tauch folgendes auf:
Code: 
var pos = this.ueberschriften.push(element.innerHTML);
element.onclick = function(){
	Tabelle.prototype.onClickUe(pos);
}
Und die Funktion ist wie folgt definiert:
Code: 
Tabelle.prototype.onClickUe = function(pos)
{
	alert(this.innerHTML);
	alert(pos);
}

Wenn ich den Code ausführe bekomme ich als erstes Alert ein "undefined"

Gruß

-André-
 
Tabelle ist dort nicht der Name des Objektes, sondern der des Konstruktors(Konstruktor nennt man die Funktion, die das Objekt erstellt).

Hier mal ein Beispiel, ob es in die Richtung von dem geht, was du suchst, weiss ich nicht. :-(
Code: 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
                                charset=ISO-8859-1"   />
<meta name="author"             content="doktormolle" />
<meta name="date"               content="2009-03-23" />
<title>Test</title>

</head>
<body>
<h1>Testüberschrift</h1>
<script type="text/javascript">
<!--

function Tabelle(element)
{
  this.element=element;
  this.ueberschriften=[];
  var pos = this.ueberschriften.push(this.element.innerHTML);
  this.element.onclick = function()
  {
	  objektname.onClickUe(pos);
  }
}

Tabelle.prototype.onClickUe = function(pos)
{
	alert(pos);
	alert(this.element.innerHTML);
}


//Hier erst wird das Objekt erstellt....sein Name wird objektname lauten
objektname=new Tabelle(document.getElementsByTagName('H1')[0]);

//-->
</script>
</body>
</html>

Beachte:
Bei der Zuweisung this.element.onclick = function(){....} befindest du dich wie erwähnt innerhalb der Funktion im Geltungsbereich des Elementes(in meinem Beispiel die <h1> )
Innerhalb der Funktion, die dann beim Klick aufgerufen bist, befindest du dich wieder im Geltungsbereich des Objektes...du kannst also von dort nicht per this auf die <h1> zugreifen, sondern musst den Zeiger aus dem Objekt holen, ich habe dort einen Zeiger auf das Element angelegt:
Code: 
this.element=element;
 
Zuletzt bearbeitet:
Du verwendest zum aufruden der Funktion den namen des Objektes. Aber damit macht doch die Objektorientierung überhaupt keinen Sinn mehr, wenn ich jetzt ein zweites Objekt mit new Tabelle erstelle, müsste ich ja das ganze Objekt umschreiben und an dieser Stelle den neuen namen eintragen.
Das kann doch nicht des Sinn der Sache sein! Wen ich die Funktion ohne Parameter aufrufen kann muss es doch auch möglich sein sie mit Paramertern aufzurufen!

Gruß
-André-
 
Hi,

möglich wäre auch das "Closuren" der this-Referenz in einer lokalen Variablen. Diese steht dann innerhalb der Eventroutine zur Verfügung.
Code: 
function Tabelle(element){
  this.element = element;
  this.ueberschriften = [];
  var pos = this.ueberschriften.push(this.element.innerHTML);
  // Referenz auf Objekt in Closure-Variable
  var _this = this;
  this.element.onclick = function(){
    _this.onClickUe(pos);
  }
}

Ciao
Quaese
 
Danke für dei antworten,
ich hab das jetzt so gelöst, das ich dem Element als Eigenschat das Objekt anhänge und dann wieder auf alle variablen zugreifen kann.

Gruß

-André-
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück