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
 123456
78910111213
14151617181920
21222324252627
282930    

Viernes 4 de Abril 2025
Semana 14

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