90

this is my checkbox

HTML

<label class="checkbox">
    <input id="eu_want_team" name="eu_want_team" type="checkbox">
</label>

JQuery

var eu_want_team = $('#eu_want_team').val();
alert(eu_want_team);

Its always displaying ON, is it checked or not. Whats the problem with it?

2
  • 1
    Welcome to Stack Overflow. I've re-tagged as jQuery, assuming that's where $() and val() come from. Feel free to correct it if I was wrong. And next time you ask about a non-native JavaScript function don't forget to post its code or mention what library it belongs to. Commented Aug 22, 2013 at 10:08
  • 1
    u should use .prop('checked') in jQuery Commented Apr 8, 2018 at 12:12

6 Answers 6

71

Use .is(':checked') instead: Working jsFiddle

var eu_want_team = $('#eu_want_team').is(':checked');
alert(eu_want_team);

or as @Itay said in comments you can use jQuery's .prop() to get the checked property value:

alert($("#eu_want_team").prop("checked"));
3
  • 2
    +1 . Or $("#eu_want_team").prop("checked")
    – Itay
    Commented Aug 22, 2013 at 10:04
  • @Itay You're also right. will add to answer
    – Yotam Omer
    Commented Aug 22, 2013 at 10:04
  • when i alert using .is(":checked"); i get false always Commented Mar 11, 2020 at 13:57
15
<label class="checkbox">
    <input id="eu_want_team" name="eu_want_team" type="checkbox" value="somevalue">
</label>

<script>
   var ele = document.getElementById("eu_want_team");
   if(ele.checked)
   alert(ele.value)

</script>
2

This will work :

if ($('#element').is(":checked")) {
    eu_want_team = 1;
} else {
    eu_want_team = 0;
}
alert(eu_want_team);
1

Have a quick look at this answer for checking if a checkbox is checked.

How to check whether a checkbox is checked in jQuery?

But basically you want to do something like below to check its value:

if ($("#element").is(":checked")) {
  alert("I'm checked");
}
1

i think this is what you want to do

$("#eu_want_team").click(function(){
    alert($(this).is(':checked')); 
}
0

Try this

if ( $('#element').is(':checked')){
    alert(element);
   }