Check checkbox checked property using jQuery

Question

I need to check the checked property of a checkbox and perform the action based on the checked property using jQuery.

For example, if the age checkbox is checked, then I need to show a textbox to enter age, else hide the textbox.

But the following code gives false as by default:

if ($('#isAgeSelected').attr('checked')) {
    $("#txtAge").show();
}
else
{
    $("#txtAge").hide();
}

Did I miss anything here?

Answer 1

Try this:

if ($('#isAgeSelected').is(':checked')) { $("#txtAge").show(); } else { $("#txtAge").hide(); }

You can shorten this using ternary, some might say it's a bit less readable, but that's how I would do it:

$('#isAgeSelected').is(':checked') ? $("#txtAge").show() : $("#txtAge").hide();

EDIT (14 months later): There's a much prettier way to do this, using toggle:

$('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
});

<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div>​

Demo: http://jsfiddle.net/5udtC/

Answer 2

I believe you could do this:

if ($('#isAgeSelected :checked').size() > 0)
{
    $("#txtAge").show(); 
} else { 
    $("#txtAge").hide();
}

Answer 3

This worked for me.

$get("isAgeSelected ").checked == true

where isAgeSelected is the id of the control.

Answer 4

The code is proper, you should check for mistake in other part of your code.

Answer 5

I am using this and this is working absolutely fine:

if($("#checkkBoxId").attr("checked")==true)
{
    alert("Checked");
}
else
{
    alert("Unchecked");
}

Note: If the checkbox is checked it will return true otherwise undefined, so better check for the "TRUE" value.