Grow your CSS skills. Land your dream job.

Last updated on:

Check if Checkbox is Checked

Say that 10 times fast =).

Find out if a single checkbox is checked or not, returns true or false:

$('#checkBox').attr('checked');

Find all checked checkboxes:

$('input[type=checkbox]:checked');

Reference URL

Comments

  1. LuK
    Permalink to comment#

    $(“input[type='checkbox']:checked”).each(function(){

    // your code

    });

  2. What if a radio button is selected?

  3. Permalink to comment#

    The website is horrible in IE6. At least the design for the page should be made differently to work in IE6

  4. Hasmi
    Permalink to comment#

    var val=$(“input:checked”).length
    if(val>0){//At least one checked

    }

    if(val<0){//Nothing checked

    }

  5. Appreciate but you should upgrade the IE version.

  6. Pranjay
    Permalink to comment#

    Another way to do this is $(element).prop(‘checked’) [ http://api.jquery.com/prop/ ]. This would always return a true or false value similar to what Wouter has suggested in is() method. $(‘#checkBox’).attr(‘checked’) however, will only return true when the box is checked and will return ‘undefined’ when unchecked.

  7. Also, I opine css-tricks’ audience are mostly web developers – In this containerful, (I comedian) they don’t use IE6 as their nonpayment browser.

  8. Stamatov
    Permalink to comment#

    $(‘#checkBox’)[0].attr(‘checked’);
    better add [0] to this code. I do this coz id is unique and there should be only one element with this id per page.
    Also useful if you want to checked/unchecked checkbox or radio button via jquery
    $(‘#checkBox’)[0].attr(‘checked’,true);
    $(‘#checkBox’)[0].attr(‘checked’,false);

    cheers!

    • Careful here, adding [0] to the end of that jQuery object will make it stop being a jQuery object and just a regular pointer thing. attr() will no long work on it.

  9. Stamatov
    Permalink to comment#

    very true, my mistake.
    btw after small research i found that it will be better to use .prop() function about this case.

  10. Permalink to comment#

    Is there a reason you can’t use: $(‘#checkBox:checked’);

  11. Permalink to comment#

    On a separate but related note, has anyone noticed or explain why CSS and JQuery handle :checked differently? Where CSS looks at the latest state of a set of radios, jQuery only seems to see what is in the dom on page load. I created a jsfiddle to illustrate… http://jsfiddle.net/cssguru/8rDXd/

  12. Permalink to comment#

    This really nice article . have a look of this also

    http://dotnetpools.com/Article/ArticleDetiail/?articleId=199&title=Code-to-check-if-checkbox-is-checked-using-jQuery-|-Validate-checkbox-is-checked-or-un-checked

  13. soncu
    Permalink to comment#

    Very good explanation

Leave a Comment

Current day month ye@r *

*May or may not contain any actual "CSS" or "Tricks".