jQuery: check if checkboxes are checked

I want to highlight any unchecked checkboxes when a form is submitted. I've got a total of six checkboxes in .new_order , and I've started writing the function but I'm a bit stuck how to add a highlight class to each unchecked checkbox in .new_order .

$('#orderconfirm').click(function () {
    if ($('.modal .modal-body .new_order :checkbox').is(':unchecked') {
        $(this).addClass('highlight');
    }
});

Will this code iterate through each checkbox? I feel like I'm missing something. Also, this code has to disable the button until each checkbox is checked. Any help would be great!


Try using :not(:checked) at the end of your selector, call .addClass() on this to add the class to all objects returned.

Demo

$('#orderconfirm').click(function () {
    $('.modal .modal-body .new_order input:checkbox:not(:checked)')
        .addClass('highlight');
});

Here is a working jsFiddle of the following method.

You could use jQuery's each() to iterate through your class, and add your CSS class to whichever elements meet your criteria:

$('#orderconfirm').click(function () {
  $('.new_order').each(function(){
     if($(this).prop('checked') === false) {
        $(this).addClass('highlight');
     }
  });
});
链接地址: http://www.djcxy.com/p/55998.html

上一篇: 添加选中全部并取消选中复选框内的所有选项

下一篇: jQuery:检查复选框是否被选中