Question

这是我上一个问题的后续跟进。我所拥有的是以下内容：

<div class="abc">
    <input  id="Response[0]" name="Response[0]" type="checkbox" />
    <input  id="Response[1]" name="Response[1]" type="checkbox" />
    <input  id="Response[2]" name="Response[2]" type="checkbox" />
    <input  id="Response[3]" name="Response[3]" type="checkbox" />
</div>

我从lonesomeday那里得知，检查复选框集合的一种方法如下：

  $('.abc input').change(function() {
if ($('.abc input:checked').length) {
    $('#doCheckMark').prop('disabled', false);
} else {
    $('#doCheckMark').prop('disabled', true);
}

但似乎第二行可能存在问题。我认为这是我的错，因为我更改了代码以添加div和class。

当我调试函数被调用但是我无法添加监视来检查.abc input:checked的值时会发生什么。我想我做错了，因为这看起来不适合变量名。

有人可以帮忙吗？变量是否正确？

谢谢

Answer 1

这就是你需要的：

$('.abc input:checkbox').change(function(){
    if($('.abc input:checkbox:checked:first').length){
        $('#doCheckMark').removeAttr('disabled');
    } else{
        $('#doCheckMark').attr('disabled', 'disabled');
    }
}).trigger('change');

你可以test it here

它会将change事件附加到该组复选框，并在加载页面时触发change，因此默认情况下将禁用该按钮。一旦用户选中/取消选中复选框，它将触发change事件，在这种情况下，它将检查是否有任何复选框被检查。如果选中任何复选框，则会启用该按钮，否则将禁用该按钮。您需要在此处使用属性attr，而不是属性prop。

Answer 2

尝试：

$('.abc input').change(function() {
if ($(this).is(':checked')) {
    $('#doCheckMark').prop('disabled', false);
} else {
    $('#doCheckMark').prop('disabled', true);
}
});

当您切换复选框值时，这将切换#doCheckMark已禁用状态。当然这会引起混淆，因为你在这个范围内有这么多的复选框。如果所有复选框都被激活，您是否要切换禁用的语句？如果是这样，试试：

$('.abc input').change(function() {
if ($('.abc input:checked').length == 4) {
    $('#doCheckMark').prop('disabled', false);
} else {
    $('#doCheckMark').prop('disabled', true);
}
});

用于复选框集合的jQuery选择器

2 个答案: