Object in javascript erstellen, mit settimeout in einer methode?
utman6
- javascript
0 Gernot Back0 Gernot Back0 utman6
0 utman6
0 LenaLuna
Hi,
ich möchte mir ein object in javascript erstellen, welches ich über eine methode(funktion) nach paar sekunden verstecken kann. Hab das mal versucht, jedoch klappt der settimeout aufruf in dem object nicht. weiss jemand warum?
<html>
<head>
<script>
function submenulayer(name,left,top)
{
//Eigenschaten
this.name = name;
this.left = left;
this.top = top;
this.Timer = 0;
//Objekt initialisieren
this.init = function()
{
document.getElementById(this.name).style.left = 100;
}
//Funktion zum verstecken des objektes
this.hide = function()
{
alert(this.name)
//document.getElementById(this.name).style.visibility = "hidden";
}
//Funktion zum verzögerten aufruf
this.hideLayer = function()
{
this.Timer = window.setTimeout(this.hide,500); //HIER IST WAS FALSCH ?
}
//initialisieren
this.init();
}
</script>
</head>
<body>
<div id="MeinLayer" style="position:absolute; visibility:visible; left:0px; background-color:red; width:100px; height:200px;" >
Blablabla
</div>
<script>
//Objekt erstellen
Layer1 = new submenulayer("MeinLayer",2,3);
Layer1.hideLayer();
</script>
</body>
</html>
Hallo utman6,
//Funktion zum verstecken des objektes
this.hide = function()
{
alert(this.name)
^^^^^
//document.getElementById(this.name).style.visibility = "hidden";
^^^^^
}
hier war was falsch, jedenfalls scheint es wie folgt stattdessen so zu funktionieren, wie du möchtest:
//Funktion zum verstecken des objektes
this.hide = function()
{
alert(name)
document.getElementById(name).style.visibility = "hidden";
}
Die Methode "hide()" hat keine Eigenschaft "name", das Objekt, zu dem sie gehört sehr wohl.
Gruß Gernot
Hallo Gernot,
Kommando zurück! Deine Methode, auch wenn da für meinen Geschmack unnötigerweise viele this-Zeiger vorkommen, funktioniert doch auch, zumindest im IE. Liegt es vielleicht daran, dass du nicht deklarierst, um was für eine Art <script> es sich handelt und ich mit dem IE getestet habe?
Gruß Gernot
wie kann man es dann sinvoller schreiben? Hab noch ein problem (+ dem was ich vorher geschrieben hatte :) )
Mein Object bekommt die ein atribut namens "hidetimer". Warum kann ich es in der einen Methode nur über "this" ansprechen, wobei es in der anderen methode, welche mit settimeout aufgerufen wird, ohne this angesprochen werden muss. Gibt da da evtl. noch einen anderen besseren weg?
Hier mein aktueller Code:
<html>
<head>
<script type="text/javascript">
/************************************
* Klasse
* Konstruktor für ein Submenüobjekt
************************************/
function create_submenulayer(name)
{
//Atribute
this.name = name;
this.hidetimer = 1;
/*****************************
* Methode hide_action()
* versteckt das Object
*****************************/
this.hide_action = function()
{
//alert(hidetimer)
document.getElementById(name).style.visibility = "hidden";
clearTimeout(hidetimer);
}
/********************************
* Methode hide()
* Ruft die Methode "hide_action"
* nach X-sekunden verzögerung auf.
**********************************/
this.hide = function(speed)
{
//alert(this.hidetimer)
clearTimeout(this.hidetimer);
hidetimer = window.setTimeout(this.hide_action,speed);
}
}
</script>
<script type="text/javascript">
//Objekt erstellen
Layer1 = new create_submenulayer("MeinLayer1");
Layer2 = new create_submenulayer("MeinLayer2");
function hidetest(objekt)
{
objekt.hide(1000)
}
</script>
</head>
<body>
<div id="MeinLayer1" style="position:absolute; visibility:visible; left:0px; background-color:red; width:100px; height:200px;" >
Layer1
</div>
<div id="MeinLayer2" style="position:absolute; visibility:visible; left:0px; top:250; background-color:red; width:100px; height:200px;" >
Layer2
</div>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<a href="#" onClick="hidetest(Layer1);">[wegmach]</a><br>
<a href="#" onClick="hidetest(Layer2);">[wegmach]</a>
</body>
</html>
Hallo utman6,
wie kann man es dann sinvoller schreiben? Hab noch ein problem (+ dem was ich vorher geschrieben hatte :) )
Mein Object bekommt die ein atribut namens "hidetimer". Warum kann ich es in der einen Methode nur über "this" ansprechen, wobei es in der anderen methode, welche mit settimeout aufgerufen wird, ohne this angesprochen werden muss. Gibt da da evtl. noch einen anderen besseren weg?
Ich muss zugeban, dass ich bisher noch wenig objektorientiert in JS programmiert habe. Ich fange selbst damit erst gerade an und glaube ich kann da mehr von dir lernen als umgekehrt.
Mit Programmiersprachen, die einen zu Objektorientierung zwingen, weil sie bei jedem Furz eine Deklaration erwarten, ob die Eigenschaft oder Methode jetzt public oder private ist, tue ich mich sehr schwer.
In Java habe ich in meiner Abschlussprüfung vor drei Jahren mit "Ach und Krach" eine Vier geschafft, in JS mit Leichtigkeit eine Eins, wobei da aber noch nicht einmal "this" vorkam.
Immerhin ich weiß inzwischen, dass "this" immer eine Referenz auf das aktuelle oder aufrufende Objekt liefert, die auch die Zeit überdauert. Deshalb ist Bindung an "this" ja auch praktisch, um einer zeitverzögert durch Timeout oder Eventhandler aufgerufenen Funktion auch ohne Übergabeparameter, der ansonsten mittlerweile gar nicht mehr aktuell ist, sagen zu können, worauf sie sich beziehen soll.
Deshalb denke ich, du hast es in deinem Code jetzt genau richtig verwendet, auch wenn ich noch nicht genau verstehe warum.
Gruß Gernot
Hi,
besten Dank :)
hab da gleich nochmal eine frage :).
und zwar zu diesre zeile
Timer = window.setTimeout(this.hide,500);
warum kann ich keine Klammer hinter die funktion schreiben? Ich möchte z.B. der funktion hide einen parameter übergeben
bsp:
Timer = window.setTimeout(this.hide('test'),500);
allerdings erhalte ich dann einen fehler. Weisst du da auch rat? :)
hallo,
//Funktion zum verzögerten aufruf
this.hideLayer = function()
{
this.Timer = window.setTimeout(this.hide,500);
}
ich denke, das problem ist, dass du beim ersten parameter des setTimeout's gültige javascriptanweisungen übergeben musst.
das heisst die müssen in stringform sein. z.bsp. so.
window.setTimeout("this.hide;",500);
dies wird aber in deinem fall auch nicht funktionieren. weil die setTimeout-methode im gültigkeitsbereich des windowobjektes aufgerufen wird.
mit anderen worten ist die this-referenz gar nicht vorhanden oder die falsche.
damit das funktioniert wie du willst musst du deine verbergefunktion global ablegen.
var verbergefunktion = function....
und dann kannst du sie mit
window.setTimeout("verbergefunktion;",500);
aufrufen.
das ist natürlich der ganze objektorientierta ansatz futsch...
du musst dir im klaren sein, javascript ist nicht wirklich objektorientiert.
gruss LenaLuna