显示/隐藏表单元素的JQuery代码

我有一张填有三行复选框的表格。我只希望当且仅当第三个复选框仅在第一行中被选中时，后两行才可用。到目前为止，我一直在显示所有三行，因此很可能我没有正确调用JQuery

另外，如果表单在隐藏/显示时自动缩放以考虑行的丢失/增加，那就更好了。这是自动发生的吗？如果有区别的话，我正在使用引导

代码如下：

JQuery

HTML

---

您首先需要隐藏它们-建议在jquery document ready函数中这样做，例如：

$(document).ready(function() {
// Stuff to do as soon as the DOM is ready;
});

我会在复选框中附加一个“更改”事件，用于控制其他字段的显示

如果您需要在JSFIDLE或类似平台上弹出一个示例，请告诉我

$(function() {
    $('[name="checkboxes"]').on('change', function() {
        var others_checked = $('#checkboxes-fields, #checkboxes-farms').is(':checked');
        $('#group2, #group3').toggle($('#checkboxes-cropzones').is(':checked') && !(others_checked));
    }).trigger('change');
});

尝试：

---

你能做个演示吗？函数showHide。。您没有在任何地方调用此函数$name=复选框whatttt修正了一些错误。我希望你能从这里接受：小费。始终在控制台中查找错误。看一看,；抱歉，如果不清楚，但是如果第三个复选框和其他两个复选框中的任何一个都被选中，那么第二行就不可用了。在html本身中效果很好，但是在html中没有。我只是通过将答案插入标记来错误地调用函数吗？顺便说一句，+1股：在就绪功能下写入。比如$document.readyfunction{$input[name='checkbox'].change……。}；

$(document).ready(function() {
// Stuff to do as soon as the DOM is ready;
});

$(function() {
    $('[name="checkboxes"]').on('change', function() {
        var others_checked = $('#checkboxes-fields, #checkboxes-farms').is(':checked');
        $('#group2, #group3').toggle($('#checkboxes-cropzones').is(':checked') && !(others_checked));
    }).trigger('change');
});

$(document).ready(function(){
    $("input[name='checkboxes']").change(function () {
        if (($('#checkboxes-farms').prop('checked') == false) && ($('#checkboxes-fields').prop('checked') == false) && ($('#checkboxes-cropzones').prop('checked') == true)) {
            $('#group2,#group3').show();
        } else {
            $('#group2,#group3').hide();
        }
    });
});