Wie man ein Radio-Button in einem HTML5-Formular erstellen

kategorie Internet & Social Media / Web Design & Development / Web Pages

Um Radio-Buttons auf Ihrer HTML5 Web-Seite, hilft es zu wissen, was sie sind und wie sie verwendet werden. An der Oberfläche scheinen Radiobuttons viel wie Kontrollkästchen, aber sie unterscheiden sich in einer Reihe von wichtigen Punkten:

  • Radiobuttons treten nur in Gruppen. Sie können ein Kontrollkästchen in einem Formular, aber Radio-Buttons machen nur dann Sinn, wenn sie in Gruppen angeordnet.

  • Es kann nur ein Element ausgewählt werden. ein Optionsfeld Auswahl wählt die anderen. Es ist wie ein Autoradio, in dem eine der Preset-Tasten klicken, die anderen abgewählt. (Es ist wirklich wie die alten Autoradios, wo, wenn Sie die Taste für die ausgewählte Station physisch geschoben wurde in die anderen Tasten herausspringen würde. Obwohl diese Art von Radio ist längst vorbei, der Name lebt weiter.)

  • Das Ich würde jeder Optionsfeld ist einzigartig. Jeder Ich würde auf einer Webseite muss eindeutig sein, und die Ich würde Elemente der einzelnen Radiobutton diese Regeln befolgen.

  • Jedes Funkelement hat auch eine Name Attribut. Das Name Attribut wird verwendet, um die gesamte angeben Gruppe von Radio-Objekten.

  • Alle Radio-Buttons in einer Gruppe haben den gleichen Namen. HTML verwendet die Name um herauszufinden Attribut welcher Gruppe ein Optionsfeld in ist, und um sicherzustellen, dass nur eine Taste in einer Gruppe ausgewählt ist.


Diese Abbildung zeigt eine Form einer Gruppe von Radiobuttons für die Wahl Small, Medium enthält, oder Groß:

bild0.jpg

Wenden Sie den folgenden Code um das Setup für eine Web-Seite mit den Tasten zu sehen:

formDemo.html
Formular Demo

Um eine Gruppe von Optionsfeldern bauen, gehen Sie folgendermaßen vor:

  1. Beginnen Sie damit, eine Schaffung Eingang Element als grundlegende Basis zu dienen.

  2. Stellen Sie den Art nach Radio.

  3. Geben Sie jedem Radiobutton eine einzigartige Ich würde.

  4. Verwenden Sie die Name Attribut alle Tasten in einer Gruppe zu identifizieren.

  5. Betrachten wir als auch visuelle Gruppierung.

    Der Benutzer kann nicht sagen, welche Tasten Teil einer Gruppe, die durch die HTML-Formatierung sind allein. Sie können Fieldset oder andere Formatierungen Tricks der Benutzer zu helfen wissen, welche Tasten sind in die Gruppe. Alle Tasten in einer Gruppe sollte in der Nähe von einander physisch sein.

  6. Stellen Sie eine der Tasten geprüft (ausgewählt) standardmäßig aktiviert.

    Tragen Sie die checked = "geprüft" Attribut (von der Abteilung der Redundanz-Abteilung zur Verfügung gestellt), um eines der Elemente, so dass es ausgecheckt wird gestartet.

    Wenn Sie Radioknopf nicht ein vorgewählt werden, alle Programme zu Ihrem Formular beigefügt werden verwirrt.

In Verbindung stehende Artikel
Über den Autor
So erstellen Sie Radio-Buttons für Ihre HTML5 und CSS3-basierte Web-Seiten So erstellen Sie Radio-Buttons für Ihre HTML5 und CSS3-basierte Web-Seiten

Radio-Buttons sind für HTML5 und CSS3 Webseiten verwendet, wenn der Benutzer aus einer Gruppe nur eine Option lassen wollen wählen. Sie können ein Beispiel für eine Radiobutton-Gruppe in Aktion zu sehen.Radio-Buttons, könnten ähnliche scheinen…

Erstellen Wie Abgibt und Reset-Tasten in HTML5 Erstellen Wie Abgibt und Reset-Tasten in HTML5

Senden und Reset-Tasten helfen dem Anwender den Browser sagen, was mit einem Formular auf Ihrer Website zu tun. Sie können HTML verwenden, um Schaltflächen erstellen entweder in das Formular einreichen oder zurückzusetzen, die unter Verwendung…

Wie Verwenden von Kontrollkästchen und Radiobuttons in Ihre HTML5-Formular Wie Verwenden von Kontrollkästchen und Radiobuttons in Ihre HTML5-Formular

Wenn eine Datensammlung Formular für Ihre Website zu erstellen, wenn auch nur eine endliche Menge von möglichen Werten für den Benutzer verfügbar ist, können Sie ihm eine Sammlung von Optionen geben zur Auswahl:Kontrollkästchen: Wählen Sie…

So verwenden Textfelder in Ihr HTML5-Formular So verwenden Textfelder in Ihr HTML5-Formular

Sie können eine Vielzahl von Eingabefeldtypen in Ihre Formulare verwenden, wie zum Beispiel Text, Passwort, Radio (Taste), Checkbox, versteckt, Suche, tel (Telefonnummer), url, Email (Adresse), Terminzeit, Datum, Monat, Woche, Zeit, datetime-local,…

TitledPane in JavaFX Kontrollen TitledPane in JavaFX Kontrollen

EIN betitelte Scheibe in JavaFX ist eine Scheibe, die einen einzelnen Inhaltsknoten und zieht eine Titelleiste und einen Rahmen um den Inhalt, den Inhalt von anderen Inhalten in der Szene zu unterscheiden enthält.Außerdem Titelscheiben sind…

Wie Interpretieren Radiobuttons in javascript für HTML5 und CSS3 Programmierung Wie Interpretieren Radiobuttons in javascript für HTML5 und CSS3 Programmierung

Abrufen von Informationen aus einer Gruppe von Radiobuttons in javascript erfordert eine etwas andere Technik für die HTML5-Seite als die meisten der Formularelemente. im Gegensatz zu den wählen Objekt, gibt es keine Container-Objekt, das…

Wie Verwenden von PHP ein HTML5-Formular mit komplexen Elementen zu bauen Wie Verwenden von PHP ein HTML5-Formular mit komplexen Elementen zu bauen

Ein Beispiel für die Verwendung von PHP komplexer HTML5 Formen zu bauen, schauen über monty.html. Dieses Programm ist eine Hommage an einen der besten Filme aller Zeiten. (Möglicherweise müssen Sie einfach diesen Film ausleihen, wenn Sie sich…

Radio hören auf dem iPod nano der 5. Generation Radio hören auf dem iPod nano der 5. Generation

Sie können nun Ihre Lieblingsradiosender auf dem neuen iPod nano hören. Sie können den iPod nano FM-Radio-Funktion Melodie in einer bestimmten Station verwenden oder verwenden Funktionen Suchen und Scannen, die ähnlich sind, was Sie in einem…

So fügen Sie Schaltflächen zu einem HTML5-Formular So fügen Sie Schaltflächen zu einem HTML5-Formular

Die allgegenwärtige Schaltfläche ist eine Klammer einer beliebigen Webseite, und wenn Sie Ihre Seite Gebäude sind mit HTML5, können Sie alle gängigen Arten von Tasten umfassen. Es gibt drei Haupttypen von Tasten, obwohl sie alle dem Benutzer…

Wie eine Checkbox in Ihr HTML5-Formular zu konstruieren Wie eine Checkbox in Ihr HTML5-Formular zu konstruieren

Manchmal wollen Sie Ihre Web-Seite Benutzer, um anzuzeigen, ob die Informationen richtig oder falsch ist. Die HTML5 Checkbox Element ist für diese Art von Eingabe perfekt, weil der Benutzer klicken kann, um die Option zu aktivieren oder…

Die Grundlagen der HTML5 Forms Die Grundlagen der HTML5 Forms

Mit Formularstruktur-Tags auf Ihrer HTML5 Web-SeiteVon Anfang an, Web-Seiten haben die Fähigkeit zu sammeln Daten von Nutzern hatte. HTML5 hat einen Standard, aber sehr nützliche Satz von Formelementen Sie Eingabe zu erhalten verwenden können.…

Mit Formularstruktur-Tags auf Ihrer HTML5 Web-Seite Mit Formularstruktur-Tags auf Ihrer HTML5 Web-Seite

Von Anfang an, Web-Seiten haben die Fähigkeit zu sammeln Daten von Nutzern hatte. HTML5 hat einen Standard, aber sehr nützliche Satz von Formelementen Sie Eingabe zu erhalten verwenden können. Diese Formelemente folgen viele der gleichen Regeln…

» » » » Wie man ein Radio-Button in einem HTML5-Formular erstellen