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

  14. wishn4fishn

    This is great… I was looking for a way to do this but then I still need to figure out who to finish from there. Find all the boxes checked, sum the value of each one checked and then carry on to the next stage of the filtering process…. So many things.

Leave a Comment

Current ye@r *

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