Comment puis-je vérifier si une case est cochée?


207

Je crée une application Web mobile avec jQuery Mobile et je souhaite vérifier si une case est cochée. Voici mon code.

<script type=text/javascript>
  function validate(){
    if (remember.checked == 1){
      alert("checked") ;
    } else {
      alert("You didn't check it! Let me check it for you.")
    }
  }
</script>

<input id="remember" name="remember" type="checkbox" onclick="validate()" />

Mais pour une raison ou une autre, il ne l'exécute pas.

Veuillez aider!

---- EDIT ----- C'est ce que j'ai pour le moment.

<DIV data-role="content" data-theme="g">
    <DIV class=ui-grid-g-login>
        <FORM method=post action=[$=PROBE(266)/] data-theme="C">
            <P>~DATA_ERROR~</P>
            <div id="mail" data-role="fieldcontain">
                <label for="mail">Email:*</label>       
                <input id="mail" name="mail" type="email" />
            </div>
            <div id="pass" data-role="fieldcontain">
                <label for="pass">Paswoord:*</label>        
                <input id="pass" name="pass" type="password" />
            </div>
            <div id="remember" data-role="fieldcontain">
                <label for="remember">Onthoud mij</label>       
                <input id="remember" name="remember" type="checkbox" onclick="validate()" />
            </div>
            <P><INPUT class=btn name=submit value=Login type=submit  onclick="validate()"></P>  
        </FORM>
    </DIV>
</DIV><!-- /content -->

<script type=text/javascript>
function validate(){
    var remember = document.getElementById('remember');
    if (remember.checked){
        alert("checked") ;
    }else{
        alert("You didn't check it! Let me check it for you.")
    }
}
</script>

----ÉDITER--

Résolu, le problème était que le contenu du champ était également nommé `` se souvenir ''


1
Qu'est- rememberce que dans ce contexte: if (remember.checked == 1){???
PeeHaa

Plus tard, il devrait se souvenir de l'email et du mot de passe. C'est pour une page de connexion
Steaphann

Ce que j'essaie de dire, c'est que rememberc'est undefineddans ce contexte. Essayez console.log(remember);.
PeeHaa

Quelle version de HTML utilisez-vous? Ce n'est pas vraiment du XHTML, n'est-ce pas?
Mr Lister

Comme @Steaphann l'a mentionné dans l'édition, le code n'a pas fonctionné car il y a deux éléments avec le même identifiant dans le html. <div id="remember" data-role="fieldcontain">et <input id="remember" name="remember" type="checkbox" onclick="validate()" />. Aucune des réponses n'a attrapé ce problème.
Antony

Réponses:


289

checkedest la booleanpropriété afin que vous puissiez l'utiliser directement dans les IFconditions: -

 <script type="text/javascript">
    function validate() {
        if (document.getElementById('remember').checked) {
            alert("checked");
        } else {
            alert("You didn't check it! Let me check it for you.");
        }
    }
    </script>

2
Je reçois toujours le message «Vous ne l'avez pas vérifié! Laissez-moi vérifier pour vous.
Steaphann

Non, ça marche bien pour moi; je reçois les deux messages d'alerte.
Pranav

@Steaphann Avez-vous remplacé le mot «rappelez-vous» par votre identifiant de case à cocher? ... oh, vient de remarquer 2012 0.o ... ps vous avez oublié le point-virgule après la deuxième déclaration d'alerte
josh.thomson

.. Que faire si je ne veux pas qu'il le vérifie pour moi et que je veux juste voir s'il est vérifié ou non?
Mark Kramer

@ josh.thomson les points-virgules sont facultatifs.
kojow7

66

Essaye ça:

function validate() {
  var remember = document.getElementById("remember");
  if (remember.checked) {
    alert("checked");
  } else {
    alert("You didn't check it! Let me check it for you.");
  }
}

Votre script ne sait pas quelle est la variable remember. Vous devez d'abord obtenir l'élément en utilisant getElementById ().


1
Vous devriez également conseiller de supprimer cela == 1. Son fonctionne uniquement à cause de deux erreurs. En fait, la valeur est trueou false, il devrait simplement utiliserif( remeber.checked )
jAndy

Je reçois toujours le message «Vous ne l'avez pas vérifié! Laissez-moi vérifier pour vous.
Steaphann

16

Cela devrait vous permettre de vérifier si l'élément avec id='remember'est'checked'

if (document.getElementById('remember').is(':checked')

4
isn'appartient pas à l'objet élément DOM
yves amsellem

12
.is()- est une fonction jQuery. .checkedest javascript.
max kaplan

8

Si vous utilisez ce formulaire pour une application mobile, vous pouvez utiliser l'attribut requis html5. vous ne voulez pas utiliser de validation de script java pour cela. Ça devrait marcher

<input id="remember" name="remember" type="checkbox" required="required" />

5

utiliser comme ça

<script type=text/javascript>
function validate(){
if (document.getElementById('remember').checked){
          alert("checked") ;
}else{
alert("You didn't check it! Let me check it for you.")
}
}
</script>

<input id="remember" name="remember" type="checkbox" onclick="validate()" />

1
Je reçois toujours le message «Vous ne l'avez pas vérifié! Laissez-moi vérifier pour vous.
Steaphann

@ user1251632 WFM aussi. Pouvez-vous modifier votre question et montrer ce que vous avez maintenant? Peut-être avez-vous fait une erreur de copier-coller.
Mr Lister

document.getElementById ('Remember'). checked == 1 a été modifié par moi avant votre commentaire .. c'est peut-être le problème.
hkutluay

4

J'utilise ceci et cela fonctionne pour moi avec Jquery :

Jquery:

var checkbox = $('[name="remember"]');

if (checkbox.is(':checked'))
{
    console.log('The checkbox is checked');
}else
{
    console.log('The checkbox is not checked');
}

C'est très simple, mais ça marche.

Cordialement!


4

Utilisez ce code simple ci-dessous: https://jsfiddle.net/Divyesh_Patel/v7a4h3kr/7/

<input type="checkbox" id="check">
<a href="#" onclick="check()">click</a>
<button onclick="check()">button</button>
<script>
 function check() {
    		if (document.getElementById('check').checked) {
            alert("checked");
        } else {
            alert("Not checked.");
        }
       
    }

</script>


3
    if (document.getElementById('remember').checked) {
        alert("checked");
    }
    else {
        alert("You didn't check it! Let me check it for you.");
    }

3

Cela devrait fonctionner

    function validate() {
        if ($('#remeber').is(':checked')) {
            alert("checked");
        } else {
            alert("You didn't check it! Let me check it for you.");
        }
    }

2

remembern'est pas défini ... et la checkedpropriété est un booléen et non un nombre.

function validate(){
    var remember = document.getElementById('remember');
    if (remember.checked){
        alert("checked") ;
    }else{
        alert("You didn't check it! Let me check it for you.")
    }
}

1

Vous pouvez essayer ceci:

if ($(#remember).is(':checked')){
   alert('checked');
}else{
   alert('not checked')
}

0

Utilisez ce code simple ci-dessous: https://jsfiddle.net/Divyesh_Patel/v7a4h3kr/7/

<input type="checkbox" id="check">
<a href="#" onclick="check()">click</a>
<button onclick="check()">
button
</button>
<script>
 function check() {
    		if (document.getElementById('check').checked) {
            alert("checked");
        } else {
            alert("You didn't check it! Let me check it for you.");
        }
       
    }

</script>


-1

Essaye ça

<script type="text/javascript">
window.onload = function () {
    var input = document.querySelector('input[type=checkbox]');

    function check() {
        if (input.checked) {
            alert("checked");
        } else {
            alert("You didn't check it.");
        }
    }
    input.onchange = check;
    check();
}
</script>

-1

Vous pouvez également utiliser les méthodes JQuery pour ce faire:

<script type="text/javascript">
if ($('#remember')[0].checked) 
{
 alert("checked");
}
</script>
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.