Welches HTML-Formulareingabeelement muss verwendet werden, um mehrere Optionen darzustellen, aber nur eine auszuwählen?

Verwendung von <input type="radio"> in HTML-Formularen

In HTML-Formularen gibt es verschiedene Eingabeelemente, um Daten zu erheben. Eines davon ist das <input type="radio">-Element.

Die Frage zielt auf das Eingabeelement ab, das verwendet wird, um mehrere Optionen darzustellen, aber nur eine auszuwählen. Das korrekte Element für diese Funktion ist das <input type="radio">-Element.

Verständnis <input type="radio">

Ein Radio-Button oder ein Optionsfeld ermöglicht es dem Benutzer, ein Element aus einer Liste von Optionen auszuwählen. In HTML wird es mit dem <input>-Tag und dem Attribut type="radio" erstellt.

Ein einfaches Beispiel könnte so aussehen:

<form>
  <input type="radio" id="option1" name="option" value="option1">
  <label for="option1">Option 1</label><br>
  <input type="radio" id="option2" name="option" value="option2">
  <label for="option2">Option 2</label><br>
  <input type="radio" id="option3" name="option" value="option3">
  <label for="option3">Option 3</label>
</form>

In diesem Beispiel gibt es drei Radio-Buttons, aber der Benutzer kann nur einen auswählen. Wichtig ist, dass alle Radio-Buttons innerhalb der gleichen Gruppe (hier identifiziert durch das 'name'-Attribut) nur einen ausgewählten Wert zulassen.

Best Practice

Die Radio-Buttons sind konsistent gestaltet und leicht zu identifizieren. Verwenden Sie immer Etiketten (<label>), um den Wert der Optionen zu erklären. Achten Sie darauf, dass das 'for'-Attribut des Labels mit der 'id' des zugehörigen Radio-Buttons übereinstimmt. Dies verbessert die Barrierefreiheit und erleichtert es Benutzern mit Screenreadern, Ihre Formulare zu verwenden.

Außerdem ist es wichtig zu wissen, dass die <input type="checkbox">-Eingabeelemente verwendet werden, wenn es mehrere auswählbare Optionen gibt und der Benutzer mehr als eine Option auswählen kann. Im Gegensatz dazu sind <input type="text">-Felder zur Eingabe von Textdaten geeignet.

Insgesamt spielen HTML-Eingabeelemente eine entscheidende Rolle beim Sammeln von Benutzerdaten auf Webseiten. Es ist daher wichtig, das richtige Element für die richtige Anforderung zu wählen.

Finden Sie das nützlich?