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
    123
45678910
11121314151617
181920 21222324
252627282930 

Jueves 21 de Noviembre 2024
Semana 47

..............................................................................................................................................................................................................................................
(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