编辑最后一个复选框将停用其他复选框

Question

我正在编辑一个表单，不幸的是，它是从这样的插件中出来的，并且我无法编辑 html。我希望最后一个复选框在单击时取消选择其他两个字段。在我的示例中，它部分起作用，从某种意义上说，如果仅单击其他一个，则最后一个会正确取消选择，而不是我希望它能够单击 1 和 2 或“全部”（禁用其他）。感谢您的任何建议

$(document).ready(function () {
    $('#check-video-d').click(function () {
        $('.check-video').prop('checked', false);
    });

    $('.check-video').change(function () {
        var check = ($('.check-video').filter(":checked").length == $('.check-video').length);
        $('#check-video-d').prop("checked", check);
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="elementor-field-subgroup  elementor-subgroup-inline">
    <span class="elementor-field-option">
        <input type="checkbox" value="1" id="form-field-field_e1c2b75-0" name="form_fields[field_e1c2b75][]" class="check-video">
        <label for="form-field-field_e1c2b75-0">1</label>
    </span>
    <span class="elementor-field-option">
        <input type="checkbox" value="2" id="form-field-field_e1c2b75-1" name="form_fields[field_e1c2b75][]" class="check-video" data-gtm-form-interact-field-id="4">
        <label for="form-field-field_e1c2b75-1">2</label>
    </span>
    <span class="elementor-field-option">
        <input type="checkbox" value="No ALL" name="form_fields[field_e1c2b75][]" id="check-video-d" data-gtm-form-interact-field-id="5">
        <label for="form-field-field_e1c2b75-2">No ALL</label>
    </span>
</div>

Answer 1

如果您想要选择 1 和 2 或 3，那么您可以更新代码以添加检查，无论选择 1 或 2 中的任何一个，都会将 3 标记为未选中。

$(document).ready(function () {
    $('#check-video-d').click(function () {
        $('.check-video').prop('checked', false);
    });

    $('.check-video').change(function () {
      if(this.checked) $('#check-video-d').prop('checked', false)
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="elementor-field-subgroup  elementor-subgroup-inline">
    <span class="elementor-field-option">
        <input type="checkbox" value="1" id="form-field-field_e1c2b75-0" name="form_fields[field_e1c2b75][]" class="check-video">
        <label for="form-field-field_e1c2b75-0">1</label>
    </span>
    <span class="elementor-field-option">
        <input type="checkbox" value="2" id="form-field-field_e1c2b75-1" name="form_fields[field_e1c2b75][]" class="check-video" data-gtm-form-interact-field-id="4">
        <label for="form-field-field_e1c2b75-1">2</label>
    </span>
    <span class="elementor-field-option">
        <input type="checkbox" value="No ALL" name="form_fields[field_e1c2b75][]" id="check-video-d" data-gtm-form-interact-field-id="5">
        <label for="form-field-field_e1c2b75-2">No ALL</label>
    </span>
</div>