HighDots Forums  

onClick Background-Color einer Checkbox ändern

Javascript (German) Programmiersprache JavaScript. (de.comp.lang.javascript)


Discuss onClick Background-Color einer Checkbox ändern in the Javascript (German) forum.

Reply
 
Thread Tools Display Modes
  #1  
Old   
Adrian Stern
 
Posts: n/a

Default onClick Background-Color einer Checkbox ändern - 06-20-2008 , 03:38 AM






Hallo

Ich möchte eine Checkbox wenn sie geklickt wird, mit einer Farbe
Hinterlegen.
Oder am besten gleich den hintergrund der darumliegenden Tabellenzelle.

Wie greiffe ich darauf zu?

_javascript: document.Formular.IDdesElements.???

verschachtelt ist das ganze so:

<td>
<span style="background-color:Yellow;">
<input id="ID" type="checkbox" name="Name" />
</span><
/td>

Damit der Benutzer sieht, dass er Änderungen vorgenommen hat, sollen die
felder hervorgehoben werden.

Wie setze ich den Hintergrund eines Elements?
Wie kriege ich das darüberliegende Element heraus?




Reply With Quote
  #2  
Old   
Robin Rattay
 
Posts: n/a

Default Re: onClick Background-Color einer Checkbox ändern - 06-20-2008 , 06:29 AM






On 20 Jun., 09:38, Adrian Stern <adrian.st... (AT) phzh (DOT) ch> wrote:
Quote:
Ich möchte eine Checkbox wenn sie geklickt wird, mit einer Farbe
Hinterlegen.
Oder am besten gleich den hintergrund der darumliegenden Tabellenzelle.

Wie greiffe ich darauf zu?

_javascript: document.Formular.IDdesElements.???
Formular-Elemente werden im Elements-Collection des Formulars mit
dessen Namen nicht ID angesprochen:

document.NameDesFormulars.NameDesElements

Wobei es eindeutiger und lesbarer ist die "lange" Form zu benutzen:

document.forms["NameDesFormulars"].elements["NameDesElements"]

Altenativ können alle HTML-Elemente (nicht nur Formular-Elemente) mit
der ID angesprochen werden:

document.getElementById("IdDesElements")

In deinem Fall brauchst du aber beides nicht, da im Event-Handler die
Referenz zum Checkbox mit this erreichbar ist (siehe unten).

Quote:
verschachtelt ist das ganze so:

td
span style="background-color:Yellow;"
input id="ID" type="checkbox" name="Name" /
/span
/td
Ist der SPAN wirklich nötig/richtig? Du willst doch den Hintergrund
der ganzen Zelle und nicht nur "drum herum" markieren, oder?

Quote:
Wie setze ich den Hintergrund eines Elements?
ReferenzZumElement.style.backgroundColor = "yellow";

Quote:
Wie kriege ich das darüberliegende Element heraus?
parentNode

Einfaches Beispiel:

<td>
<input type="checkbox" name="Name"
onclick="this.parentNode.style.backgroundColor = (this.checked ?
'yellow' : 'white')" />
</td>

Wenn du es öffter einsetzt ist es besser das ganze in eine Funktion zu
packen und this als Parameter zu übergeben.

Robin


Reply With Quote
  #3  
Old   
Adrian Stern
 
Posts: n/a

Default Re: onClick Background-Color einer Checkbox ändern - 06-20-2008 , 07:23 AM



..Net hat mir hier einige Steine in den Weg gelegt ... ich habe zB. nicht
die nötigen IDs bekommen. Lösen konnte ich es in dem ich ne Funktion
erstellt habe die onClick gefeuert wird function(this).

Und der Zugriff erfolgte über this.parentNode.bgColor.

Danke dir.

Robin Rattay schrieb:
Quote:
On 20 Jun., 09:38, Adrian Stern <adrian.st... (AT) phzh (DOT) ch> wrote:
Ich möchte eine Checkbox wenn sie geklickt wird, mit einer Farbe
Hinterlegen.
Oder am besten gleich den hintergrund der darumliegenden Tabellenzelle.

Wie greiffe ich darauf zu?

_javascript: document.Formular.IDdesElements.???

Formular-Elemente werden im Elements-Collection des Formulars mit
dessen Namen nicht ID angesprochen:

document.NameDesFormulars.NameDesElements

Wobei es eindeutiger und lesbarer ist die "lange" Form zu benutzen:

document.forms["NameDesFormulars"].elements["NameDesElements"]

Altenativ können alle HTML-Elemente (nicht nur Formular-Elemente) mit
der ID angesprochen werden:

document.getElementById("IdDesElements")

In deinem Fall brauchst du aber beides nicht, da im Event-Handler die
Referenz zum Checkbox mit this erreichbar ist (siehe unten).

verschachtelt ist das ganze so:

td
span style="background-color:Yellow;"
input id="ID" type="checkbox" name="Name" /
/span
/td

Ist der SPAN wirklich nötig/richtig? Du willst doch den Hintergrund
der ganzen Zelle und nicht nur "drum herum" markieren, oder?

Wie setze ich den Hintergrund eines Elements?

ReferenzZumElement.style.backgroundColor = "yellow";

Wie kriege ich das darüberliegende Element heraus?

parentNode

Einfaches Beispiel:

td
input type="checkbox" name="Name"
onclick="this.parentNode.style.backgroundColor = (this.checked ?
'yellow' : 'white')" /
/td

Wenn du es öffter einsetzt ist es besser das ganze in eine Funktion zu
packen und this als Parameter zu übergeben.

Robin

Reply With Quote
  #4  
Old   
Robin Rattay
 
Posts: n/a

Default Re: onClick Background-Color einer Checkbox ändern - 06-20-2008 , 09:01 AM



On 20 Jun., 13:23, Adrian Stern <adrian.st... (AT) phzh (DOT) ch> wrote:
Quote:
.Net hat mir hier einige Steine in den Weg gelegt ... ich habe zB. nicht
die nötigen IDs bekommen. Lösen konnte ich es in dem ich ne Funktion
erstellt habe die onClick gefeuert wird function(this).
Was ich dir ja eh geraten habe :-)

Quote:
Und der Zugriff erfolgte über this.parentNode.bgColor.
Warum verwendest du .style.backgroundColor nicht?

Robin


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.