Todas las Noticias en Películas, Avances de Películas y Reseñas.

Aprendizaje de HTML Parte 30: uso de la casilla de verificación de tipo de entrada, tipo de radio y atributo marcado en formulario HTML

En el tutorial anterior, aprendimos cómo crear un formulario simple en HTML junto con el uso de etiquetas de entrada y los valores de tipo de entrada, a saber, texto, contraseña y envío. Bueno, en este tutorial, lo que se discute es el uso de la casilla de verificación de tipo de entrada, radio y también el atributo marcado.

Para obtener más detalles sobre los dos valores y atributos de tipo de entrada, veamos el tutorial a continuación:

1. Casilla de verificación de tipo de entrada

La casilla de verificación de tipo de entrada se usa para crear una lista de opciones con una pequeña casilla que mostrará una lista de verificación si se hace clic en la casilla y se puede seleccionar más de una. El siguiente es un ejemplo de escritura y uso de una casilla de verificación de tipo de entrada en 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>

Después de ejecutar el código anterior en el navegador, aparecerá como se muestra a continuación:

2. Tipo de entrada de radio

El tipo de entrada de radio se utiliza para crear una lista de opciones de las que solo se puede seleccionar una. El siguiente es un ejemplo de escritura y uso de tipos de entrada de radio en 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>

Después de ejecutar el código anterior en el navegador, aparecerá como se muestra a continuación:

Recomendado:  Especificaciones filtradas del teléfono móvil de nivel de entrada Infinix Hot 10

3. Atributo marcado

El atributo marcado se usa en casillas de verificación y radios de tipo de entrada para indicar si un elemento está seleccionado o no (define la selección predeterminada). El siguiente es un ejemplo de cómo escribir código y usar el atributo marcado en la etiqueta en 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>

Después de ejecutar el código anterior en el navegador, aparecerá como se muestra a continuación:

Ahora comprende el uso de los atributos anteriores. Continúe estudiando el siguiente material, que trata sobre el uso de elementos de área de texto en formularios HTML.