[javascript] How can I check if a checkbox is checked?

I am building a mobile web app with jQuery Mobile and I want to check if a checkbox is checked. Here is my 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()" />

But for some reason or another it doesn't execute it.

Please help !

----EDIT----- This is what I have for the 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>

----EDIT--

Solved it, the problem was that the fieldcontain was also named 'remember'

This question is related to javascript jquery-mobile checkbox

The answer is


use like this

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

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

Use this below simple code: https://jsfiddle.net/Divyesh_Patel/v7a4h3kr/7/

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


You can also use JQuery methods to accomplish this:

<script type="text/javascript">
if ($('#remember')[0].checked) 
{
 alert("checked");
}
</script>

Use this below simple code: https://jsfiddle.net/Divyesh_Patel/v7a4h3kr/7/

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


I am using this and it works for me with Jquery:

Jquery:

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

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

Is very simple, but work's.

Regards!


checked is boolean property so you can directly use it in IF condition:-

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

Try this:

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

Your script doesn't know what the variable remember is. You need to get the element first using getElementById().


This should allow you to check if element with id='remember' is 'checked'

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

This should work

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

Try This

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

You can try this:

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

remember is undefined … and the checked property is a boolean not a number.

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

If you are using this form for mobile app then you may use the required attribute html5. you dont want to use any java script validation for this. It should work

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

Examples related to javascript

need to add a class to an element How to make a variable accessible outside a function? Hide Signs that Meteor.js was Used How to create a showdown.js markdown extension Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Summing radio input values How to execute an action before close metro app WinJS javascript, for loop defines a dynamic variable name Getting all files in directory with ajax

Examples related to jquery-mobile

How to auto adjust the div size for all mobile / tablet display formats? how to get value of selected item in autocomplete jQuery Cross Domain Ajax How to set cookie value with AJAX request? Disable scrolling when touch moving certain element disable past dates on datepicker Custom Input[type="submit"] style not working with jquerymobile button jQuery Mobile: document ready vs. page events How to redirect on another page and pass parameter in url from table? Remove attribute "checked" of checkbox

Examples related to checkbox

Setting default checkbox value in Objective-C? Checkbox angular material checked by default Customize Bootstrap checkboxes Angular ReactiveForms: Producing an array of checkbox values? JQuery: if div is visible Angular 2 Checkbox Two Way Data Binding Launch an event when checking a checkbox in Angular2 Checkbox value true/false Angular 2: Get Values of Multiple Checked Checkboxes How to change the background color on a input checkbox with css?