web-dev-qa-db-fra.com

Comment déterminer si une case à cocher est cochée?

Pour une raison quelconque, mon formulaire ne veut pas obtenir la valeur d'une case à cocher ... Je ne sais pas si c'est mon codage ou non, mais lorsque j'essaie de alert() la valeur, le résultat est undefined. Qu'est-ce que j'ai mal?

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

MODIFIER

J'ai essayé de le changer en ceci

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

Mais maintenant, il ne veut même pas execute. Qu'est-ce qui ne va pas?

javascripthtmlcheckbox
56
Sean

Placez le var lfckv dans la fonction. Lorsque cette ligne est exécutée, le corps n'est pas encore analysé et l'élément "lifecheck" n'existe pas. Cela fonctionne parfaitement bien:

function exefunction() {
  var lfckv = document.getElementById("lifecheck").checked;
  alert(lfckv);
}
<label><input id="lifecheck" type="checkbox" >Lives</label>
<button onclick="exefunction()">Check value</button>

96
Elian Ebbing

Vous essayez de lire la valeur de votre case à cocher avant qu'elle ne soit chargée. Le script s'exécute avant que la case à cocher existe. Vous devez appeler votre script lors du chargement de la page:

<body onload="dosomething()">

Exemple:

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

Il manque également un point-virgule après votre première affectation.

6
Jeff B

Vous pouvez utiliser ce code, il peut renvoyer true ou false:

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

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

});

4
rapaelec

La ligne où vous définissez lfckv est exécutée à chaque fois que le navigateur le trouve. Lorsque vous le placez dans la tête de votre document, le navigateur essaie de trouver l'identifiant lifecheck avant la création de l'élément lifecheck. Vous devez ajouter votre script sous l'entrée lifecheck pour que votre code fonctionne.

1
Joel

Si la case à cocher est cochée et si elle ne l’est pas, l’afficheur suivra.

$(this).is(":checked")

Remplacez $ (this) par la variable à vérifier.

Et utilisé dans un état:

if ($(this).is(":checked")) {
  // do something
}
0
Flavio Caduff

<!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>

ainsi, vous pouvez ensuite ajouter un événement en javascript pour que l'événement dynamique soit affecté par la case à cocher.

merci

0
rapaelec

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


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

merci

0
rapaelec

essayez d'apprendre jQuery c'est un bon endroit pour commencer avec javascript, cela simplifie vraiment votre code et vous aide à séparer votre js de votre code HTML. inclure le fichier js du CDN de Google (https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js)

puis dans votre balise de script (toujours dans le <head>), utilisez:

$(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);
    });
});
0
Walf