HTML Radiobutton für die Webseite

Radiobutton: Auswahl aus mehreren Antworten

Neben der Checkbox gibt es auch noch den Radiobutton, um in einem HTML-Formular Antwortmöglichkeiten anbieten zu können. Der Unterschied besteht darin, dass bei einer Checkbox eine Antwort angeklickt ergo ausgewählt werden kann oder nicht, jede Checkbox aber für sich steht. Beim Radiobutton gibt es verschiedene Antwortmöglichkeiten, es kann aber nur eine Antwort ausgewählt werden und die Antworten hängen zusammen.

Allerdings kann man sich hier nur für eine Antwort entscheiden und so als Betreiber auch ja/nein-Situationen auflösen. Entweder man antwortet mit "ja" oder mit "nein", aber beides ist nicht möglich. Eine Mehrfachantwort wie bei den Checkboxen ist auch nicht vorgesehen.

Radiobuttons in HTML-Formulare

ergibt:

Wie wird das Wetter?

Sonnig
Regnerisch
Gewittrig

Mit dem Radiobutton, einer Art von Formularfeld des input-Tags, ist es möglich, verschiedene Antworten zu einer Frage zu kombinieren. Es ist nur eine Antwort möglich, daher springt das Auswahlsymbol von Antwort zu Antwort, je nachdem, welche Antwort man gerade ausgewählt ergo aktiviert hat.

Zusammen mit den Checkboxen sind die Radiobuttons oft bei HTML-Formularen im Einsatz, um die Beantwortung von Fragen zu erleichtern und zu beschleunigen. Besonders oft werden Sie Radiobuttons bei Umfragen antreffen, wenn über ein Unternehmen bewertet werden soll, ob es gut, durchschnittlich oder schlecht agiert oder ob eine Werbekampagne gelungen ist oder nicht.

Würde man hier Checkboxen einsetzen, könnte es passieren, dass man vier Antworten zur gleichen Frage erhält. Bei den Radiobuttons ist diese Gefahr nicht gegeben, denn es kann nur eine Antwort geben. Ändert man die Antwort, dann ändert sich auch der Wert, der übergeben wird.

Mit checked kann man zudem vorselektieren, welche Antwort aktiv sein soll, wenn das Formular geladen wird.

Lesen Sie auch

Die Formulare sind überraschend wichtige Elemente auf der Webseite, denn jede größere Plattform hat auch eine Suchmaschine und damit auch ein Eingabefeld - ergo ein Formular für diesen Zweck. Es gibt aber unterschiedliche Methoden, was und wie man für das Formular braucht. Typisch sind das Textfeld, das versteckte Textfeld für Bearbeitungen wie der aktuellen Artikelnummer und ein großes mehrzeiliges Feld für Fragen und Kommentare. Außerdem braucht es das form-Tag als generelles Element für Formulare und die Schaltfläche zum Abschicken.

Weitere Möglichkeiten bestehen mit Auswahlfeldern. Das kann die Checkbox sein, um eine Antwortoption zu aktivieren, die Radiobuttons für ja/nein-Situationen oder auch die Auswahlliste, wenn mehrere Antworten vorgeschlagen werden.

Bei den Formularen gibt es noch weitere Möglichkeiten, die sehr wichtig sein können. Eine Variante ist die Beschreibung durch den label-Tag, wodurch auch die Formatierung besser gelingt und eine weitere kann sein, dass man schreibgeschützte Felder einsetzt.

Diesen Artikel teilen

Kategorien

Grundlagen
HTML-Grundlagen
CSS-Grundlagen
Javascript-Grundlagen
PHP-Grundlagen
MySQL-Grundlagen
SEO-Grundlagen

Infos, Tipps, Vermarktung
Webdesign-Lexikon
Online-Werbung
PHP-Codeschnipsel