Temas > Programacion > Java script - Java > Control CHECKBOX en java script
Julio

Control CHECKBOX
El control CHECKBOX es el cuadradito que puede tener dos estados
(seleccionado o no seleccionado).
Para conocer su funcionamiento y ver como podemos acceder a su estado desde
JavaScript haremos un pequeña página.
Ejemplo: Confeccionar una página que muestre 4 lenguajes de programación
que el usuario puede seleccionar si los conoce. Luego mostrar un mensaje
indicando la cantidad de lenguajes que ha seleccionado el usuario.
<?php //esto no va
<html>
<head>
</head>
<body>
<script language="JavaScript">
function contarSeleccionados()
{
  var cnt=0;
  if (document.form1.lenguaje1.checked)
    cnt++;
  if (document.form1.lenguaje2.checked)
    cnt++;
  if (document.form1.lenguaje3.checked)
    cnt++;
  if (document.form1.lenguaje4.checked)
    cnt++;
  alert(`Conoce ` + cnt + ` lenguajes`);
}
</script>
<form name="form1">
<input type="checkbox" name="lenguaje1">JavaScript
<br>
<input type="checkbox" name="lenguaje2">PHP
<br>
<input type="checkbox" name="lenguaje3">JSP
<br>
<input type="checkbox" name="lenguaje4">VB.Net
<br>
<input type="button" value="Mostrar" onClick="contarSeleccionados()">
</form>
</body>
</html>
?>//esto no va
Cuando se presiona el botón se llama a la función JavaScript
contarSeleccionados(). En la misma verificamos uno a uno cada control
checkbox accediendo a la propiedad checked que almacena true o false según
esté o no seleccionado el control.
Disponemos un `if` para cada checkbox:
<?php //esto no va
       if (document.form1.lenguaje1.checked)
              cnt++;
?>//esto no va
Al contador `cnt` lo definimos e inicializamos en cero previo a los cuatro
if. Mostramos finalmente el resultado final.













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google






LunMarMieJueVieSabDom
       
1234567
8910111213 14
15161718192021
22232425262728
2930     

Domingo 14 de Septiembre 2025
Semana 37

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal