2011-01-21 24 views
40

Por alguna razón, mi formulario no quiere obtener el valor de una casilla de verificación ... No estoy seguro si es mi codificación o no, pero cuando intento y el valor alert(), obtengo undefined como resultado. ¿Qué tengo mal?¿Cómo puedo determinar si una casilla de verificación está marcada?

<head> 
    <script> 
    var lfckv = document.getElementById("lifecheck").checked 
    function exefunction(){ 
     alert(lfckv); 
    } 
    </script> 
</head> 
<body> 
    <label><input id="lifecheck" type="checkbox" >Lives</label> 
</body> 

EDITAR

He intentado cambiar a este

function exefunction() { 
    alert(document.getElementById("lifecheck").checked); 
} 

Pero ahora no quiere ni execute. ¿Qué está mal?

Respuesta

78

Coloque el var lfckv dentro de la función. Cuando se ejecuta esa línea, el cuerpo aún no se analiza y el elemento "lifecheck" no existe. Esto funciona perfectamente bien:

<html> 
    <head> 
     <script language="javascript" type="text/javascript"> 
      function exefunction(){ 
       var lfckv = document.getElementById("lifecheck").checked; 
       alert(lfckv); 
      } 
     </script> 
    </head> 
    <body> 
     <label><input id="lifecheck" type="checkbox" >Lives</label> 
     <button onclick="exefunction()">Check value</button> 
    </body> 
</html> 
5

Está tratando de leer el valor de su casilla de verificación antes de que se cargue. La secuencia de comandos se ejecuta antes de que la casilla de verificación exista. Usted necesita llamar a su script cuando se carga la página:

<body onload="dosomething()">

Ejemplo:

http://jsfiddle.net/jtbowden/6dx6A/

También se echa en falta un punto y coma después de su primera asignación.

+0

El punto y coma no es necesario para javascript. – Joel

+9

Todavía es una buena práctica. –

1

La línea donde se define lfckv ejecutarse cada vez que el navegador encuentra. Cuando lo coloca en el encabezado de su documento, el navegador intenta encontrar el identificador de vida antes de que se cree el elemento de verificación de vida. Debe agregar su secuencia de comandos debajo de la entrada de verificación de vida para que su código funcione.

1

intente aprender jQuery es un gran lugar para comenzar con javascript y realmente simplifica su código y ayuda a separar su js de su html. incluya el archivo js del CDN de Google (https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js)

y luego en la etiqueta del script (aún en el <head>) use :

$(function() {//code inside this function will run when the document is ready 
    alert($('#lifecheck').is(':checked')); 

    $('#lifecheck').change(function() {//do something when the user clicks the box 
     alert(this.checked); 
    }); 
}); 
+25

-1 Creo que jQuery definitivamente no es un gran lugar para comenzar a aprender JS. – Lee

+4

¿De qué demonios estás hablando? Simplemente dije que debería estar familiarizado con Javascript antes de buscar en otras bibliotecas y marcos. ¿Qué tiene esto que ver con la separación de capas? – Lee

+1

@Lee Context, Lee. Contexto. ¿Viste la "solución"? Leer eso me lleva directamente a los '90. Claramente, OP no tiene una buena comprensión de los eventos, JavaScript está basado en eventos y jQuery es muy bueno para forzarlos a comprenderlos. No es necesario que domine JavaScript para comenzar a aprender jQuery. No "meramente declaraste" nada, excepto que no comiences con jQuery. Intenta ser constructivo, eso no es para lo que son los votos rebajados. – Walf

-1
<!DOCTYPE html> 
<html> 
<body> 
    <input type="checkbox" id="isSelected"/> 
    <div id="myDiv" style="display:none">Is Checked</div> 
</body> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
    <script> 
     $('#isSelected').click(function() { 
      $("#myDiv").toggle(this.checked); 
     }); 
    </script> 
</html> 
+2

OP no ha mencionado jquery? – atmd

+0

Hola, atmd, ahora estoy agregando el código completo. –

2

puede utilizar este código, puede devolver verdadero o falso:

$(document).ready(fonction(){ 
 
    
 
    //add selector of your checkbox 
 

 
    var status=$('#IdSelector')[0].checked; 
 
    
 
    console.lot(status); 
 

 
});

-1

var elementCheckBox = document.getElementById("IdOfCheckBox"); 
 

 

 
elementCheckBox[0].checked //return true if checked and false if not checked

gracias

0

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
</head> 
 
<body> 
 
<label><input class="lifecheck" id="lifecheck" type="checkbox" checked >Lives</label> 
 

 
<script type="application/javascript" > 
 
    lfckv = document.getElementsByClassName("lifecheck"); 
 
    if (true === lfckv[0].checked) { 
 
     alert('the checkbox is checked'); 
 
    } 
 
</script> 
 
</body> 
 
</html>

por lo que después se puede añadir evento en javascript para eventos dinámicos tienen afectada con la casilla de verificación.

gracias

Cuestiones relacionadas