ID an Funktion übergeben

[kleiner_noob]

Hallo zusammen

Da dies mein erster Thread ist, bitte ich euch, mir alle meine (Newbie-)Fehler zu verzeihen ;-)

Ich bin absoluter JavaScript-Anfänger, hab mich aber an einer kleineren Funktion versucht, welche ein Div-Element/Layer/Container mit Zugriff auf CSS (Visibility = "visible"; -> Visibility = "hidden";) vornimmt.
Dies klappt auch wunderbar, dennoch schwebt mir eine kleine 'Erweiterung' bzw. Automatisierung vor.
Mein Code sieht wie folgt aus:
(Im Body:)

<script type="text/javascript">
function schliessen2() {
 this.document.getElementById("window_2").style.visibility = "hidden";
}
</script>

(Und weiter unten:)

<div id="window_2">
<table>
<tr>
 <td><a href="#" onclick="schliessen2()">Schliess mich</a></td>
 <td>...</td>
</tr>
</table>
</div>

Dies funktioniert auch wunderbar :-) Nur muss ich für jedes 'Fenster' (Die Tabelle ist die 'Struktur' für ein 'windowsorientiertes' Fenster welches mit DHTML bewegt werden kann) eine eigene Funktion schreiben und dies ist schlichtweg mühsam und vergrössert den Code :-/

Meine Idee war, dass beim Klicken auf die Funktion in der Tabelle (schliessen2();) die ID 'window_2' der Funktion schliessen2(); übergeben wird...

<script type="text/javascript">
function schliessen2() {
 this.document.getElementById("<<ID wird hier eingefügt >>).style.visibility = "hidden";
}
</script>

Theoretisch würde es klappen, wie man das aber in einen JavaScript-Code umwandelt... :-(
Einen Lösungsansatz hab ich hier schonmal gefunden: http://forum.de.selfhtml.org/archiv/2003/2/t37506/ (Zweiter Beitrag).
Wobei ich mir langsam denke dass man anstatt 'this' und 'what' wohl eher von Hand seine eigenen Sachen einfügen sollte... da es ebenfalls (bei mir) nicht funktioniert.

Ich hoffe, jemand kann mir helfen und danke fürs durchlesen :-)

mfG Matthias / kleiner_noob

[wucher wichtel]

Hallo!

<script type="text/javascript">
function schliessen2() {
this.document.getElementById("window_2").style.visibility = "hidden";
}
</script>

  
function schliessen(window_id) {  
  document.getElementById(window_id).style.visibility = "hidden";  
}  

  
<a href="#" onclick="schliessen('window_2')">Schliess mich</a>  

Dort, wo jetzt window_2 steht kannst du die ID des Elementes das geschlossen werden soll, übergeben. Falls du dich darüber näher informieren willst: das, was in den runden Klammern steht ist ein Parameter.

Ich hoffe, jemand kann mir helfen und danke fürs durchlesen :-)

Das durchlesen macht hier am meisten Arbeit :) (was aber nicht schlecht ist, weil du dein Problem sehr ausführlich beschrieben hast und man nicht erst rumrätseln muss, was du meinst).

ciao, ww

[Der Martin]

Moin,

Da dies mein erster Thread ist, bitte ich euch, mir alle meine (Newbie-)Fehler zu verzeihen ;-)

kein Problem, die meisten typischen Newbie-Fehler machst du nämlich gar nicht: Du lieferst eine gute Beschreibung ab, verwechselst nicht Java mit Javascript, und hast auch die Grundlage deines Scripts offensichtlich nicht aus irgendeiner Mottenkiste im Internet (was man oft an total veraltetem Code erkennt).

<script type="text/javascript">
function schliessen2() {
this.document.getElementById("window_2").style.visibility = "hidden";
}
</script>

Zum grundsätzlichen Vorgehen hat der Wichtel schon den entscheidenden Hinweis gegeben, ich möchte das nur ergänzen.
Wenn kein Element mit der gewünschten ID im Dokument existiert, liefert getElementById() AFAIK null zurück (oder war's undefined?), so dass der Zugriff auf ...style.visibility eine Fehlermeldung produziert: "Object has no properties" oder so ähnlich. Den Fall sollte man daher abfangen:

if (document.getElementById(window_id))
     document.getElementById(window_id).style.visibility = "hidden";

Durch die if-Abfrage wird die Zuweisung nur ausgeführt, wenn der Ausdruck mit dem getElementById() eine gültige Referenz ergibt. Übrigens ist der Gebrauch von "this" hier unnötig.

<a href="#" onclick="schliessen2()">Schliess mich</a>

Das ist nicht schön: Von einem Link erwarte ich normalerweise, dass er mich auf eine neue Seite führt. Um "nur" eine Funktion innerhalb der Seite auszulösen, solltest du besser ein anderes Element verwenden, etwa ein button-Element. Den onclick-Handler kannst du nahezu jedem Element ankleben, das an dieser Stelle vom Kontext her sinnvoll wäre.

So long,
 Martin

[kleiner_noob]

Danke euch für die Antworten :-)

Leider funktioniert es (noch) nicht, wahrscheinlich nicht zuletzt wegen mir.

Ich habe es folgendermassen eingefügt:

(Im Body:)

<script type="text/javascript">
function schliessen(window_id) {
 this.document.getElementById(window_id).style.visibility = "hidden";
}
</script>

<div id="window_2">
[...]
<a href="#" onclick="schliessen('window_2')"><img .. /></a>
[...]
</div>

Nunja, ein Teil meiner Frage ist damit beantwortet, ich weiss wie ich die ID durch die Funktion schliessen(); weitergeben kann.
Aber wie soll die 'function schliessen(window_id)' herausfinden, dass window_1 window_id entspricht?
Ich möchte ja explizit in der function (wo window_id steht) keine spezifische ID definieren. D.h. ich müsste JavaScript ja irgendwo sagen
window_id kann window_1, window_2, window_3 etc. sein...

Zum Abfangen der Fehlermeldung:

if (document.getElementById(window_id){
     document.getElementById(window_id).style.visibility = "hidden";
  }

Versteh ich nicht, ich gebe in jeder Funktion den Parameter mit, wie soll da eine entsprechende Fehlermeldung kommen?

Freundliche Grüsse

Matthias / kleiner_noob

[Der Martin]

Hallo Matthias,

Leider funktioniert es (noch) nicht, wahrscheinlich nicht zuletzt wegen mir.

wie äußert sich dieses Nicht-Funktionieren? Was für eine Fehlermeldung?

<script type="text/javascript">
function schliessen(window_id) {
this.document.getElementById(window_id).style.visibility = "hidden";
}
</script>

Wie schon gesagt: Nimm das "this" mal weg. Ich vermute, dass "this" in diesem Fall nicht das window-Objekt referenziert, sondern nur den Link, in dessen Kontext die Funktion als Eventhandler aufgerufen wird.

Aber wie soll die 'function schliessen(window_id)' herausfinden, dass window_1 window_id entspricht?

Dadurch, dass du den gewünschten tatsächlichen Wert beim Aufruf der Funktion im onclick-Handler übergibst - das machst du ja auch korrekt.
Das ist das Grundkonzept von Funktionen in sehr vielen Programmiersprachen: Man definiert die Funktion mit einem Parameter (oder mehreren), der einen beliebigen Namen hat und nur als Platzhalter steht. Für diesen Platzhalter übergibt man dann beim Aufruf der Funktion den tatsächlichen Parameter.

Ich möchte ja explizit in der function (wo window_id steht) keine spezifische ID definieren.

Eben. :-)

Zum Abfangen der Fehlermeldung:
  if (document.getElementById(window_id){
     document.getElementById(window_id).style.visibility = "hidden";
  }
Versteh ich nicht, ich gebe in jeder Funktion den Parameter mit, wie soll da eine entsprechende Fehlermeldung kommen?

Angenommen, du übergibst als id-Wert nicht "window_2", sondern "morgenrot". Oder, etwas realistischer, wegen eines blöden Tippfehlers "windw_2". In deinem Dokument gibt es aber kein Element mit der ID "windw_2". Also muss der Aufruf von getElementById() scheitern. Das kann (theoretisch) auch passieren, wenn der Besucher schon rumklickt, während das Dokument noch gar nicht fertig geladen ist.
Und um in diesem Fall keine Fehlermeldung auszuwerfen, sondern den Aufruf einfach stillschweigend zu ignorieren, habe ich dir die zusätzliche Abfrage empfohlen.

Schönes Wochenende,
 Martin

[kleiner_noob]

Ich versteh die Welt nicht mehr :P
Habe euren Script 'isoliert' (in einem eigenen Dokument) angewendet und da hat er super funktioniert :-)
Lediglich in meiner aktuellen Seite funktioniert er nicht, wobei ich da einfach mal auskommentieren werde (bis es geht).

Auf alle Fälle ein riesen Danke an euch zwei und ein schönes Wochenende

mfG Matthias

[wucher wichtel]

Hallo!

Lediglich in meiner aktuellen Seite funktioniert er nicht, wobei ich da einfach mal auskommentieren werde (bis es geht).

Zeige uns doch mal den ganzen Code. Dann können wir dir weiterhelfen.

Auf alle Fälle ein riesen Danke an euch zwei und ein schönes Wochenende

Dir auch ein schönes Wochenende.

ciao, Lukas

[kleiner_noob]

Hi

Zeige uns doch mal den ganzen Code. Dann können wir dir weiterhelfen.

Hingebracht habe ich es nun - habe einige Div-Elemente entfernt und es ging. Ein Zusammenhang sehe ich nicht, da die container weder in einem der window-divs war noch sonst irgendwie einen Zusammenhang (ID, Positionierung was auch immer) hatten. Womöglich war es ein verstecktes Zeichen oder etwas dergleichen :-/
Da ich die Elemente aber nur als Test drin hatte, ist dies nicht weiter von belangen... Falls denoch jmd Interesse am Code (was ich bei meinen Programmierkentnissen bezweifle ^^) hat, soll er mir eine Mail schreiben... bin zwar Freund von OpenSource, aber nicht von Copy&Paste meines Codes wenn er einfach öffentlich (für jeden) publiziert wird...

mfG Matthias