HTML lernen Teil 30: Verwenden von Kontrollkästchen für Eingabetypen, Radiotypen und aktivierten Attributen in HTML-Formularen
Im vorherigen Tutorial haben wir studiertInformationen zum Erstellen eines einfachen Formulars in HTML sowie zur Verwendung von Eingabe-Tags und deren Eingabetypwerten, nämlich Text, Kennwort und Senden. In diesem Tutorial wird die Verwendung der Eingabe des Kontrollkästchentyps, des Radios und auch des aktivierten Attributs erläutert.
Weitere Informationen zu den beiden Werten und Attributen des Eingabetyps finden Sie im folgenden Lernprogramm:
1. Kontrollkästchen Eingabetyp
Das Kontrollkästchen Eingabetyp wird verwendet, um eine zu erstellenEine Auswahlliste mit einem kleinen Kästchen, in dem eine Checkliste angezeigt wird, wenn auf das Kästchen geklickt wird und mehrere ausgewählt werden können. Im Folgenden finden Sie ein Beispiel für das Schreiben und Verwenden von Kontrollkästchen für Eingabetypen in HTML:
<!DOCTYPE html>
<html>
<head>
<title> Penggunaan Input Type Checkbox di HTML </title>
</head>
<body>
<form action="proses_input.php" method="get">
Pilih Makanan Favorit Anda dibawah ini : <br>
<input type="checkbox" name="makanan" value="rendang">Rendang <br>
<input type="checkbox" name="makanan" value="bakso">Bakso <br>
<input type="checkbox" name="makanan" value="nasi goreng">Nasi Goreng <br>
<input type="checkbox" name="makanan" value="Mie Ayam Jamur">Mie Ayam Jamur<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>Nachdem der obige Code im Browser ausgeführt wurde, wird er wie folgt angezeigt:
2. Eingabetyp des Radios
Der Radio-Typ-Eingang wird verwendet, um eine Liste von Auswahlmöglichkeiten zu erstellen, die nur einmal ausgewählt werden können. Im Folgenden finden Sie ein Beispiel für das Schreiben und Verwenden von Radioeingaben in HTML:
<!DOCTYPE html>
<html>
<head>
<title> Penggunaan Input Type Radio di HTML </title>
</head>
<body>
<form action="proses_input.php" method="get">
Pilih Pendidikan Terakhir Anda: <br>
<input type="radio" name="pendidikan" value="SMP"> SMP <br>
<input type="radio" name="pendidikan" value="SMA"> SMA <br>
<input type="radio" name="pendidikan" value="D3/S1"> D3/S1 <br>
<input type="radio" name="pendidikan" value="S2"> S2 <br>
<input type="radio" name="pendidikan" value="S3"> S3<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>Nachdem der obige Code im Browser ausgeführt wurde, wird er wie folgt angezeigt:
3. Überprüfte Attribute
Das markierte Attribut wird für den Eingabetyp verwendetKontrollkästchen und Funkgeräte, die angeben, ob ein Element ausgewählt ist oder nicht (Standardoptionen festlegen). Hier ist ein Beispiel für das Schreiben von Code und die Verwendung des überprüften Attributs im <input> -Tag in HTML:
<!DOCTYPE html>
<html>
<head>
<title> Penggunaan Atribut Checked di HTML Forms </title>
</head>
<body>
<form action="proses_input.php" method="get">
Pilih Pendidikan Terakhir Anda: <br>
<input type="radio" name="pendidikan" value="SMA"> SMA <br>
<input type="radio" name="pendidikan" value="D3/S1" checked> D3/S1 <br>
<input type="radio" name="pendidikan" value="S2"> S2 <br> <br>
Pilih Makanan Favorit Anda dibawah ini : <br>
<input type="checkbox" name="makanan" value="rendang" checked> Rendang <br>
<input type="checkbox" name="makanan" value="bakso"> Bakso <br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>Nachdem der obige Code im Browser ausgeführt wurde, wird er wie folgt angezeigt:
Jetzt verstehen Sie die Verwendung der obigen Attribute. Bitte lernen Sie das nächste Material weiter, in dem es um die Verwendung des Textarea-Elements im HTML-Formular geht.
