Como posso verificar se uma caixa de seleção está marcada?


187

Estou criando um aplicativo da web móvel com o jQuery Mobile e quero verificar se uma caixa de seleção está marcada. Aqui está o meu código.

<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()" />

Mas, por algum motivo ou outro, não o executa.

Por favor ajude !

---- EDIT ----- Isto é o que tenho no momento.

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

----EDITAR--

Resolvido, o problema era que o campo contido também era chamado de 'lembrar'


1
O que há rememberneste contexto: if (remember.checked == 1){???
PeeHaa

Mais tarde, ele deve se lembrar de e-mail e senha. É para uma página de login
Steaphann

O que estou tentando dizer é que rememberestá undefinednesse contexto. Tente console.log(remember);.
PeeHaa

Qual versão do HTML você está usando? Não é realmente XHTML, é?
Lister

Respostas:


272

checkedé booleanpropriedade para que você possa usá-lo diretamente na IFcondição: -

 <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
Eu sempre recebo a mensagem 'Você não verificou! Deixe-me verificá-lo.
Steaphann

Não, está funcionando bem para mim; Estou recebendo as duas mensagens de alerta.
Pranav

@ Steaphann Você substituiu a palavra 'lembrar' pelo seu ID da caixa de seleção? ... oh, só notei 2012 0.o ... ps você esqueceu a ponto e vírgula após a declaração segundo alerta
josh.thomson

..E se eu não quiser verificá-lo para mim e só quero ver se está marcado ou não?
Mark Kramer

Os pontos e vírgulas @ josh.thomson são opcionais.
kojow7

61

Tente o seguinte:

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.");
  }
}

Seu script não sabe qual é a variável remember. Você precisa obter o elemento primeiro usando getElementById ().


Você também deve aconselhar a retirar isso == 1. Está funcionando apenas por causa de dois erros. Na verdade, o valor é trueou false, ele deve apenas usandoif( remeber.checked )
Jandy

Eu sempre recebo a mensagem 'Você não verificou! Deixe-me verificá-lo.
Steaphann

16

Isso deve permitir que você verifique se o elemento id='remember'é'checked'

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

3
isnão pertence ao objeto do elemento DOM
yves amsellem 19/07/2015

10
.is()- é uma função jQuery. .checkedé javascript.
precisa

8

Se você estiver usando este formulário para aplicativos para dispositivos móveis, poderá usar o atributo necessário html5. você não deseja usar nenhuma validação de script java para isso. Deveria funcionar

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

5

use assim

<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
Eu sempre recebo a mensagem 'Você não verificou! Deixe-me verificá-lo.
Steaphann

@ user1251632 WFM também. Você pode editar sua pergunta e mostrar o que tem agora? Talvez você tenha cometido um erro de copiar e colar.
Lister

document.getElementById ('lembrar'). verificado == 1 foi alterado por mim antes do seu comentário .. pode ser o problema.
hkutluay

4

Estou usando isso e funciona para mim com o Jquery :

Jquery:

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

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

É muito simples, mas funciona.

Saudações!


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

3

Use este código simples abaixo: 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>


2

rememberé indefinido… e a checkedpropriedade é um booleano e não um número.

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.")
    }
}

2

Isso deve funcionar

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

1

Você pode tentar isso:

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

0

Use este código simples abaixo: 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

Tente isto

<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

Você também pode usar métodos JQuery para fazer isso:

<script type="text/javascript">
if ($('#remember')[0].checked) 
{
 alert("checked");
}
</script>
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.