Einfache Funktion, styles zu ändern

[Malcolm Beck´s]

hi,

ich hab hier ein kleines fitzel Javascript, dass CSS-Werte ändern kann, was auch sehr gut funktioniert, nur eine Sache kriege ich nicht hin.

  
 function klappfunction(id,wert) {  
   document.getElementById(id).style.display = wert;  
 }

Aufgerufen wird das ganze dann mit:

  <em onclick="klappfunction('table_1','none')">-</em>  
 <em onclick="klappfunction('table_1','block')">+</em>

Ich habe versucht,in diesem Stück Code noch den Wert „display“ Variabel zu Gestalten, so dass ich mit dieser Funktion mehr ändern kann als nur die display-Eigenschaft, aber irgendwie haut das nicht hin.

  
 function klappfunction(id,eigenschaft,wert) {  
   document.getElementById(id).style.eigenschaft = wert;  
 }

<em onclick="klappfunction('table_1','display','none')">-</em>

Warum wird hier eigenschaft nicht interpretiert?
Die fehlerkonsole meldet auch nichts.

Online-Beispiel

mfg

[Cheatah]

Hi,

function klappfunction(id,eigenschaft,wert) {
   document.getElementById(id).style.eigenschaft = wert;
}

> Warum wird hier eigenschaft nicht interpretiert?  
  
weil Du keine interpretierbare Angabe gemacht hast. Hier wird eine CSS-Eigenschaft namens "eigenschaft" verändert (die es nicht gibt), während Dein Parameter eigenschaft unbenutzt bleibt.  
  

> Die fehlerkonsole meldet auch nichts.  
  
Natürlich nicht, der Code ist ja auch richtig. Nur wirkungslos. Das Problem hatten übrigens schon viele, viele andere vor Dir.  
  
Cheatah  

-- 
X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|  
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html  
X-Will-Answer-Email: No  
X-Please-Search-Archive-First: Absolutely Yes

[Malcolm Beck´s]

hi,

weil Du keine interpretierbare Angabe gemacht hast. Hier wird eine CSS-Eigenschaft namens "eigenschaft" verändert (die es nicht gibt), während Dein Parameter eigenschaft unbenutzt bleibt.

Ich hatte angenommen, das „eigenschaft“ als Variable durch geht und in meinem Fall nur ein „Platzhalter“ ist, der durch den Wert im Funktionsaufruf ersetzt wird.

Das Problem hatten übrigens schon viele, viele andere vor Dir.

Kannst du mir vielleicht ein Stichwort nennen, wonach ich suchen muss?

mfg

[Cheatah]

Hi,

Ich hatte angenommen, das „eigenschaft“ als Variable durch geht

dann überleg mal einen Schritt weiter: Nimm eine Funktion der Art

function foo(id, wert, getElementById)

welche im dritten Parameter übergeben bekommt, ob der Browser DOM beherrscht (true oder false). Nach Deiner Theorie müsste "document.getElementById(id)" anschließend identisch sein mit z.B. "document.true(id)", was zu einem Fehler führt, wie Du mir sicher zustimmst.

Wie um alles in der Welt soll nun die Methode document.getElementById() aufgerufen werden, wenn Deine Theorie zutrifft?

Wenn Du dies noch weiterdenkst, wäre "document.getElementById()" _ohne_ den o.g. Parameter übrigens identisch mit "document.undefined()".

und in meinem Fall nur ein „Platzhalter“ ist, der durch den Wert im Funktionsaufruf ersetzt wird.

Was unterscheidet Deinen Fall von anderen?

Das Problem hatten übrigens schon viele, viele andere vor Dir.
Kannst du mir vielleicht ein Stichwort nennen, wonach ich suchen muss?

Nachdem nun schon andere Antworten gekommen sind: Brauchst Du noch eines?

Cheatah

[Malcolm Beck´s]

hi,

function foo(id, wert, getElementById)

welche im dritten Parameter übergeben bekommt, ob der Browser DOM beherrscht (true oder false). Nach Deiner Theorie müsste "document.getElementById(id)" anschließend identisch sein mit z.B. "document.true(id)", was zu einem Fehler führt, wie Du mir sicher zustimmst.

Da stimme ich dir natürlich zu, ich würde aber auch keine Parameter verwenden, die der Sprache selbst angehören, sprich „getElementById“.
Das dass nicht funktionieren kann, könnte ich mir schon noch vorstellen.

Wie um alles in der Welt soll nun die Methode document.getElementById() aufgerufen werden, wenn Deine Theorie zutrifft?

Ich war wohl zu sehr von PHP beirrt, so dass ich angenommen hatte, ich kann mit Variablen frei arbeiten.

und in meinem Fall nur ein „Platzhalter“ ist, der durch den Wert im Funktionsaufruf ersetzt wird.
Was unterscheidet Deinen Fall von anderen?

Es ist meiner ;)

Nachdem nun schon andere Antworten gekommen sind: Brauchst Du noch eines?

Der Martin hat ja schon einen Link gepostet, der ungefähr in diese Richtung geht -- wäre schon interessant zu wissen, was ich mir da zusammen gebaut habe.
Ob es eventuell irgendwas zu beachten gibt usw.. Ansich brauche ich dieses Fitzel Code nur für meinen Adminbereich, aber eventuell kann ich ihn ja noch erweitern und auch Offiziell auf meinen Seiten verwenden.

mfg

[LX]

Och, Cheatah!

weil Du keine interpretierbare Angabe gemacht hast. Hier wird eine CSS-Eigenschaft namens "eigenschaft" verändert (die es nicht gibt), während Dein Parameter eigenschaft unbenutzt bleibt.

Du hättest Ihm durchaus noch sagen können, dass man variable Eigenschaften eines Objekts mit objekt[eigenschaft] ansprechen kann. Wir sind hier um zu helfen, nicht, um zu frustrieren.

Gruß, LX

[Der Martin]

Moin,

Ich habe versucht,in diesem Stück Code noch den Wert „display“ Variabel zu Gestalten, so dass ich mit dieser Funktion mehr ändern kann als nur die display-Eigenschaft, aber irgendwie haut das nicht hin.

function klappfunction(id,eigenschaft,wert) {

document.getElementById(id).style.eigenschaft = wert;
}

  
das kann auch so nicht gehen, siehe Cheatah.  
  

> Die fehlerkonsole meldet auch nichts.  
  
Natürlich nicht. Du fügst dem style-Objekt eine neue Eigenschaft namens eigenschaft hinzu. Das ist zweckfrei, aber erlaubt.  
  
Du suchst vermutlich die verschiedenen [Adressierungsschemata](http://de.selfhtml.org/javascript/objekte/elements.htm) für Javascript-Objekte. Ungünstig, dass eine so wichtige Information in SELFHTML ausgerechnet den Formularen zugeordnet ist, obwohl es eine ganz allgemeine Geschichte ist (Operatoren, Zugriff auf Array/Objekt-Elemente).  
  
So long,  
 Martin  

-- 
Der Alptraum jedes Computers:  
"Mir war, als hätte ich gerade eine 2 gesehen."

[Malcolm Beck´s]

hi,

Du suchst vermutlich die verschiedenen Adressierungsschemata für Javascript-Objekte. Ungünstig, dass eine so wichtige Information in SELFHTML ausgerechnet den Formularen zugeordnet ist, obwohl es eine ganz allgemeine Geschichte ist (Operatoren, Zugriff auf Array/Objekt-Elemente).

Stimmt, es ist ungefähr das „Schema 4 / Beispiel 4:“, wobei es in meinem Fall ja anscheinend noch viel einfacher ist.

Danke jedenfalls für den Link.

mfg

[Der Martin]

Hallo,

Du suchst vermutlich die verschiedenen Adressierungsschemata für Javascript-Objekte.
Stimmt, es ist ungefähr das „Schema 4 / Beispiel 4:“

nicht nur ungefähr, sondern es *ist* das dort als "Schema 4" vorgestellte.

wobei es in meinem Fall ja anscheinend noch viel einfacher ist.

Das ist genau das als "Schema 4" vorgestellte. :-)

So long,
 Martin

[Malcolm Beck´s]

hi,

nicht nur ungefähr, sondern es *ist* das dort als "Schema 4" vorgestellte.

Wenn man sich damit auskennt, dann sicherlich ;)
Da ich aber nicht wirklich Ahnung von Javascript habe, verwirrt das

  
document.forms["Formularname"].elements["Elementname"].Eigenschaft

„.Eigenschaft“ ein wenig.

Aber ich bin schon froh, dass ich es wenigstens halbwegs gut hinbekommen habe, diese Funktion klein und übersichtlich zu halten ;)
Ich Liebe minimalistische Funktionen ;))

Jetzt muss ich nur noch versuchen, dass ganze mit Cookies anzupassen, um zu speichern, ob ein Element aufgeklappt ist oder nicht, aber dass wird, wie ich schon feststellen durfte, ein wenig schwieriger.

mfg

[molily]

Da ich aber nicht wirklich Ahnung von Javascript habe, verwirrt das

document.forms["Formularname"].elements["Elementname"].Eigenschaft

>   
> „.Eigenschaft“ ein wenig.  
  
objekt.eigenschaft heißt natürlich, dass objekt und eigenschaft Platzhalter für Bezeichner sind.  
  
Es gibt zwei Möglichkeiten, um in JavaScript Unterobjekte (auch Member oder spezieller Methoden bzw. Eigenschaften genannt) anzusprechen:  
  
objekt.unterobjekt  
objekt["unterobjekt"]  
  
Beim ersten ist unterobjekt immer ein fester Bezeichner, beim zweiten wird zwischen den eckigen Klammern ein Ausdruck erwartet, der einen String ergibt - bzw. es wird einfach ein beliebiger Ausdruck erwartet, der wird dann ausgerechnet und das Ergebnis automatisch in einen String umgewandelt.  
  
Jetzt musst du den Unterschied beachten zwischen:  
  
1\. einem Bezeichner (Identifier), der direkt im Quellcode notiert ist  
2\. einem String-Literal, der direkt im Quellcode notiert ist  
3\. einem Bezeichner, der auf eine String-Variable verweist, die einen Bezeichnernamen enthält  
  
Beispiel 1.  
  
document.forms  
  
Komplexer:  
document.forms.bla.elements.blub.type  
  
bla und blub sind hier natürlich feste Namen. Bei der Schreibweise objekt.eigenschaft ist das immer so und muss immer so sein.  
  
Beispiel 2.  
  
document.forms["bla"].elements["blub"].type  
  
Zwischen den eckigen Klammern ist ein String-Literal im Quelltext notiert. Dabei sind die Namen ebenfalls fest, nur anders notiert.  
  
Beispiel 3.  
  
var formularname = "bla", feldname = "blub";  
document.forms[formularname].elements[feldname].type  
  
Wie gesagt kann zwischen den Klammern ein beliebiger Ausdruck stehen, der ein String ergibt, also schreiben wir einen Variablennamen dazwischen. Der wird dann aufgelöst zu seinem Wert - und das ist ein String.  
  
Die zweite Zeile ist dadurch variabel - was sie ergibt, hängt davon ab, welche Werte in den verwendeten Variablen gespeichert sind.  
  
Mathias

-- 
[JavaScript-Erweiterung für das SELFHTML-Forum](http://forum.de.selfhtml.org/js/doku/)

[Joachim]

Hi,

function klappfunction(id,eigenschaft,wert) {
   document.getElementById(id).style.eigenschaft = wert;
}

function modify_style(id,attr,val) {
    document.getElementById(id).style[attr] =  val;
}

Gruesse, Joachim

[Malcolm Beck´s]

hi,

function klappfunction(id,eigenschaft,wert) {
   document.getElementById(id).style.eigenschaft = wert;
}
function modify_style(id,attr,val) {
    document.getElementById(id).style[attr] =  val;
}

Danke für den Hinweis, funktioniert jetzt wie gewünscht.
Ich hatte es schon mit diversen Klammern versucht, nur hatte ich immer einen „.“ zwischen „style“ und „[attr]“.

http://dj-tut.de/z_test/selfhtml/jsstyle

mfg