@@Gunnar Bittersmann
Minus Buttion - Anzeige des Zählerstands - plus-Button
Und wozu brauchst du da JavaScript?
Antwort: Weil die vom Browser angebotenen Pfeile ziemlich mickrig sind. Das kann man mit unobtrusive JavaScript verbessern (progressive enhancement).
<input type="number"/>
ist dafür die Basis. Dieser Elementtyp bietet bereits die Methoden stepDown()
und stepUp()
an – da muss man nichts mehr selber implementieren.
Bei ausgeführtem JavaScript werden per CSS die Pfeile ausgeblendet und Buttons [−] und [+] angezeigt (die per visuell verstecktem span
-Element oder aria-label
eine auch für Nutzer assistiver Technologien wie Screenreadern zugängliche Beschriftung erhalten).
Die Vorbelegung mit value
-Attribut ist nötig, sonst funktioniert’s im Safari nicht.
Per min
-Attribut kann man ganz ohne JavaScript dafür sorgen, dass die Anzahl nicht negativ werden kann. Bei Bedarf auch per max
-Attribut, dass sie einen bestimmten Wert nicht übersteigen kann.
Sieht dann so aus: Codepen.
😷 LLAP
“When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon