rstuby: mehrere css-Counter nutzen

Beitrag lesen

SELF-Forum

mehrere css-Counter nutzen

rstuby Homepage des Autors
– Informationen zu den Bewertungsregeln

problematische Seite

Hallo liebe Experten! Ich würde gerne bei meinem Quiz die Menge der maximal möglichen richtigen Antworten mit angeben. Wenn ich aber folgendes mache:

<!DOCTYPE html>

<html>
<style type="text/css" media="screen">
form{ counter-reset: fragen 0 fragenf 0 fragenr 0 falsch 0 richtig 0; }

.r {counter-increment: fragenr;}

.f:checked {counter-increment: falsch;}
.r:checked {counter-increment: richtig;}


.ergebnisf:after{content:counter(falsch)}
.ergebnisr:after{content:counter(richtig) " von " counter(fragenr); }
</style>
<body>
			<form>
			<legend>
				Wie viele Amtssprachen gibt es in der EU (Stand 2021)?
			</legend>				
			<p> 
				<input class="f" type="checkbox" id="elf" name="EU[]" value="elf">
				<label for="elf"> 11 Sprachen </label> 
			</p> 
										
			<p> 
				<input type="checkbox" id="24" class="r" name="EU[]" value="24">
				<label for="24"> 24 Sprachen </label> 
			</p> 
			<p> 
				<input class="f" type="checkbox" id="27" name="EU[]" value="27">
				<label for="27"> 27 Sprachen </label> 
			</p> 
			<p> 
				<input type="checkbox" id="alle" class="f" name="EU[]" value="alle">
				<label for="alle"> Alle Sprachen, die in den EU-Ländern gesprochen werden 					</label>
			</p>
			</form>
            <p> <span class="ergebnisr"> Richtige Antworten: </span> 
			</p>
			<p> <span class="ergebnisf"> Falsche Antworten: </span> 
			</p>


</body>

dann wird nicht die Gesamtzahl der möglichen richtigen Antworten (im Beispiel: 1) gezählt, sondern nur die Anzahl der NICHT ausgewählten richtigen Antworten - sobald die Checkbox mit class="r" angekreuzt ist, steht da "1 von 0" anstatt "1 von 1". Wenn ich den Counter "fragenr" aber auch bei f:checked hochzählen lasse, werden die angeklickten Antworten nicht mehr gezählt. Was mache ich falsch oder geht das, was ich will, mit reinem css nicht? Eine php-Lösung wäre mir auch recht! Ich arbeite nämlich gerade an einer php-Version meiner Seite.

Beitrag melden
–
Informationen zu den Bewertungsregeln

akzeptierte Antworten