|
|||
Radiobutton Zustand überwachen
Hallo zusammen
Ich würde gerne mit JS herausfinden, welcher Radiobutton gerade aktiv ist, damit ich dem entsprechenden Elternelement <p> eine zusätzliche Klasse zuweisen kann. Folgenden Code der Radiobuttons habe ich: Code:
<p class="group"><input type="radio" name="gruppe" value="a" /> A</p> <p class="group"><input type="radio" name="gruppe" value="b" /> B</p> <p class="group"><input type="radio" name="gruppe" value="c" /> C</p> Folgenden Ansatz habe ich, allerdings wird damit JEDER Button active, den ich klicke. Möchte aber nur jeweils den gewählten. Code:
function setStatus() { if(document.getElementById('dsl1000').checked == true) { document.getElementById('p-dsl1000').className='active'; } } Ich hoffe ihr könnt mir weiterhelfen. Gerne auch unter Verwendung einer kleinst Library. Grüsse, Sonny Lane |
Sponsored Links |
Sponsored Links |
|
|||
Hallo hemfrie
Vielen Dank für deine Antwort. Ich habe nun folgendes konstruiert, allerdings werden nun alle einmal ausgewählten Buttons dauerhaft "geclassed" Selbst wenn die der Radiobutton nicht mehr ausgewählt ist, bleibt die Klasse checked bzw. jedenfalls deren Styles. Hier der Code Code:
$('.radiobutton').click(function() { if($("input[name='gruppe']:checked")) { $(this).parent().addClass("checked"); } else { $(this).parent().removeClass("checked"); } }); Code:
<p class="radio-container"><input name="gruppe" class="radiobutton" type="radio" value="" /> Test></p> Geändert von Sonny Lane (18.04.2008 um 19:52 Uhr) |
|
||||
Das removeClass wurde bei Dir nur nicht ausgeführt, weil es niemals ein "else" geben wird.
Du kannst es aber recht einfach lösen, indem Du erstmal alle .checked Klassen entfernst und anschließend dem aktuellen input wieder eine .checked Klasse zuordnest. Habs bei mir mal getestet: Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de-DE"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta name="language" content="de-de" /> <title>untitled</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $("document").ready(function(){ $('.radiobutton').click(function(){ $(".radio-container").removeClass("checked") //entfernt alle checked Klassen $(this).parent().addClass("checked"); //die aktuelle Auswahl erhält eine checked Klasse }); }); </script> </head> <body> <p class="radio-container"> <input name="gruppe" class="radiobutton" type="radio" value="" />Test1 </p> <p class="radio-container"> <input name="gruppe" class="radiobutton" type="radio" value="" />Test2 </p> </body> </html> |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Eingabefeld bei Radiobutton aktivierung einblenden | crossgolfer85 | Javascript & Ajax | 1 | 17.10.2009 05:19 |
Wie 3 Radiobutton direkt neben Bild? | uooao388d99 | CSS | 2 | 19.05.2009 19:38 |
Klick auf Bild soll Radiobutton aktivieren & Formular absenden | fmp | Javascript & Ajax | 2 | 26.09.2008 16:57 |
Box soll erscheinen bei aktiviertem Radiobutton | FonFan | CSS | 6 | 27.08.2008 13:15 |
Radiobutton -> Textarea | Suvi | (X)HTML | 2 | 25.08.2008 17:01 |