✔ Button Style bei jedem "onclick" ändern + Values in Array

C

Cryog3n

Mitglied
Button Style bei jedem "onclick" ändern

Hallo an alle,

ich hab ein Problem was mich noch zum verzweifeln bringt. Jede Variation hab ich jetz schon im Netz gefunden, aber das was ich brauche krieg ich nicht hin :( Ich hoffe mir kann jemand helfen.

Ich hab mehrere Buttons die ich per CSS formatiert habe. Die Buttons sollen visuell eine Schalterfunktion bzw. Auswahlfunktion darstellen ähnlich wie Checkboxen.

Alle Buttons haben standardmäßig die Hintergrundfarbe weiß. Klick ich jetz auf den weißen Button soll er seine Hintergrundfarbe in blau abändern. Das geschieht ganz unabhängig von den anderen Buttons. Man soll auch alle Buttons blau klicken können wenn man eben alles auswählen will. Soweit hab ich das. Klick ich aber nochmal auf den Button will ich dass er wieder weiß wird... ich kriegs einfach nicht hin, sorry.

Bei jedem Klick soll der Button einfach zwischen "blau" und "weiß" wechseln. Mehr nicht... das ist alles, aber irgendwie funktioniert meine Schleife im Javascript nicht.

Hat jemand rat wie ich das hinbekomme? Wäre um jede Hilfe dankbar.

Gruß, CrYo
 
Re: Button Style bei jedem "onclick" ändern

Mal rein "Fiktiv" eine Überlegung:

Speichere den Wert eines jeden Buttons in einer Variable, z.B:

Butt_one = on (oder off)

Auf diese Variable kannst du dannn reagieren, bzw. sie abfragen!
 
Re: Button Style bei jedem "onclick" ändern

Hallo Thomas,

WOW das geht ja flot hier. Deine Idee ist schon super, aber ich bin nicht so fit in Javascript und ich weiß nicht wie ich mir die Abfrage dann zusammenwursteln soll, da ich ja dann schon im onclick Ereignis die Variable abfragen muss um in die richtige Funktion zu kommen oder? Ich glaub ich such schon zulange und hab ein Brett vorm Kopf.

Das is meine Funktion und ich kapier nicht warum das nicht geht :confused:

HTML: 
function buttonformat() {
if(document.formulardaten.Restaurant.style.background = "#FFFFFF")
	 {document.formulardaten.Restaurant.style.background = "#3A598F";}
else 
	 {document.formulardaten.Restaurant.style.background = "#FFFFFF";}
}
Restaurant is der Name meines Buttons. Blau wird er, aber nie wieder weiß *g*

Gruß, CrYo
 
Re: Button Style bei jedem "onclick" ändern

Code: 
if(document.formulardaten.Restaurant.style.background == "#FFFFFF")
da musst du 2 = nehmen.....sonst wird das eine Zuweisung und kein Vergleich.

Ich würd dir aber ne andere Methode empfehlen:
Definiere 2 Klassen mit den Farben, und vergleiche/ändere diese.

Warum: diverse Browser geben bei der Abfrage von Farbwerten nicht den Hexwert zurück:
 
Re: Button Style bei jedem "onclick" ändern

Ack!

Und mit der Korrektur von fatalus müsstest du dir die Varaiblen auch sparen können !
 
Re: Button Style bei jedem "onclick" ändern

Hm also erstmal Danke für die schnelle Hilfe.

Leider funktioniert das unverständlicherweise mit 2= garnicht mehr obwohl das eigentlich schon so passen würde. Ohje...

Das mit den 2 Klassen hört sich gut an... nur hab ich Null Ahnung wie ich das bewerkstelligen soll. Das wird eine laaaaange Nacht *gg*

Gruß, CrYo
 
Re: Button Style bei jedem "onclick" ändern

Das ist einfacher, als es sich anhören mag :)

definiere die CSS-Klassen:
Code: 
<style type="text/css">
<!--
.weiss{
    background:#ffffff;
}
.blau{
    background:#0000ff;
}
-->
</style>

Die JS-Funktion:
Code: 
<script type="text/javascript">
<!--
function toggle(objButton)
{
objButton.className=(objButton.className=='weiss')?'blau':'weiss';
}
//-->
</script>

Aufruf erfolgt aus (beliebig vielen) Buttons heraus immer per
Code: 
onclick="toggle(this)"

Dem/Den Button(s) verpasse das "class"-Attribut "blau"

Erläuterung:
per "this" wird der Funktion das auslösende Element...also der Button, als Objekt übergeben.
Das spart dir die Angabe der ID.

Die Funktion selbst prüft, ob der aktuelle Klassenname des Button 'weiss' ist.
Wenn ja...wird er in 'blau' geändert, wenn nicht, in 'weiss'.

Erhält der Button einen neuen Klassennamen, erhält er automatisch die Eigenschaftem dieser Klasse.
 
Re: Button Style bei jedem "onclick" ändern

OH MY GODNESS

Das ist perfekt! Die Lösung ist genial. Funktioniert einwandfrei. *aufdiekniefallundDANKEsag*

vorallem das...

HTML: 
=(objButton.className=='blau')?'weiss':'blau';

...ist genial!

Vielen, vielen Dank!

Gruß, CrYo
 
Erweiterung - Button Style bei jedem "onclick" ändern + Values in Array

Hallo an alle,

da mein erster Thread ja schon ein Häckchen für "erledigt" hatte aber ich noch eine Frage diesbezüglich bzw. eine Erweiterung bräuchte hoffe ich geht es in Ordnung wenn ich einen zweiten Thread starte.

Ich würde gerne das Javascript um eine Variable bzw. Array erweitern, in die ich gerne alle Values meiner Buttons (sofern aktiv bzw. style blau) beim Absenden des Formulars in die Variable geschrieben werden und die Variable dann mit dem Formulardaten dem PHP-Script dann zur Verfügung steht.

Siehe Thread "Button Style bei jedem "onclick" ändern" <- für nähere Details

Beispiel:

Button1 <- on Value -> Manfred
Button2 <- off Value -> Herbert
Button3 <- on Value -> Siegfried

$meineVariable = "Manfred Siegfried"

Das wär super wenn ich das noch mit Hilfe hinbekommen würde. Meine Schleifen funktioneiren nie... vielleicht vergleich ich auch immer eine Eigenschaft die nicht funktioniert... what ever.

Please help :)

Gruß, CrYo
 
Re: Erweiterung - Button Style bei jedem "onclick" ändern + Values in Array

Häkchen kann man wieder weg machen.... sie sollen niemanden davon abhalten, ein Thema zu lesen bzw. darin zu posten :)

Hab beide Themen mal zusammengelegt.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück