javascript - jQuery：检查复选框是否被选中

Question

我想在提交表单时突出显示所有未选中的复选框。我总共有六个复选框.new_order，我已经开始编写函数，但我有点卡住如何为每个未选中的复选框添加突出显示类.new_order。

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

这段代码会遍历每个复选框吗？我觉得我错过了什么。此外，此代码必须禁用按钮，直到选中每个复选框。任何帮助都会很棒！

Answer 1

这是以下方法的工作jsFiddle。

您可以使用 jQuery 的each()来遍历您的类，并将您的 CSS 类添加到符合您条件的任何元素中：

$('#orderconfirm').click(function () {
  $('.new_order').each(function(){
     if($(this).prop('checked') === false) {
        $(this).addClass('highlight');
     }
  });
});

Answer 2

尝试:not(:checked)在选择器的末尾使用，调用.addClass()它以将类添加到所有返回的对象。

演示

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