Question

所以我写了以下jquery：

$('#consent_for_research_no, #consent_for_global_sharing_no').on('change', function() {
    var consentForResearchIsChecked      = $('#consent_for_research_no').is(':checked');
    var consentForGlobalSharingIsChecked = $('#consent_for_global_sharing_no').is(':checked');

    if (consentForResearchIsChecked && consentForGlobalSharingIsChecked) {
        console.log('hello?');
    }
});

目标是当同时选中两者时到达console.log。控制台会显示否错误，并且当我选择两者时都不会执行任何操作。

有问题的HTML是：

<div class="form-group row">
    <label for="consent_for_global_sharing" class="col-md-4 col-form-label text-md-right">Consent For Global Sharing <a href="#" data-toggle="modal" data-target="#consentForGlobalSharing"><i class="fas fa-question-circle"></i></a></label>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_global_sharing_yes">Yes</label>
        <input type="radio" class="form-control" id="consent_for_global_sharing_yes" name="consent_for_global_sharing" value="1" {{ old('consent_for_global_sharing') === '1' ? 'checked': '' }}>
    </div>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_global_sharing_no">No</label>
        <input type="radio" class="form-control" id="consent_for_global_sharing_no" name="consent_for_global_sharing" value="0" {{ old('consent_for_global_sharing') === '0' ? 'checked': '' }}>
    </div>
</div>

<div class="form-group row">
    <label for="consent_for_research" class="col-md-4 col-form-label text-md-right">Consent For Research <a href="#" data-toggle="modal" data-target="#consentForResearch"><i class="fas fa-question-circle"></i></a></label>
    <?php dump(old('consent_for_research')); ?>
    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_research_yes">Yes</label>
        <input type="radio" class="form-control" id="consent_for_research_yes" name="consent_for_research" value="1" {{ old('consent_for_research') === '1' ? 'checked': '' }}>
    </div>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_research_no">No</label>
        <input type="radio" class="form-control" id="consent_for_research_no" name="consent_for_research" value="0" {{ old('consent_for_research') === '0' ? 'checked': '' }}>
    </div>
</div>

万一有人困惑，这是幼虫。

如何获取它，以便同时选择两者时都可以到达console.log？

当我同时选择两者并检查查询时进入控制台：$('#consent_for_research_no').is(':checked');它显示为true，与另一个相同。我在进行更改时是否缺少某些东西？

我还应该能够使用else语句来说明是否都未选中它们（即它们从“否”变为“是”），那么它应该进入else语句，但是在我处理之前，我先问如何进入if语句。

Answer 1

$('[name="consent_for_research"], [name="consent_for_global_sharing"]').on('click', function() {
    var consentForResearchIsChecked      = $('[name="consent_for_research"]:checked').val();
    var consentForGlobalSharingIsChecked = $('[name="consent_for_global_sharing"]:checked').val();
    if(consentForResearchIsChecked == 1 && consentForGlobalSharingIsChecked == 1) {
      console.log('both checked');
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row">
    <label for="consent_for_global_sharing" class="col-md-4 col-form-label text-md-right">Consent For Global Sharing <a href="#" data-toggle="modal" data-target="#consentForGlobalSharing"><i class="fas fa-question-circle"></i></a></label>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_global_sharing_yes">Yes</label>
        <input type="radio" class="form-control" id="consent_for_global_sharing_yes" name="consent_for_global_sharing" value="1" {{ old('consent_for_global_sharing') === '1' ? 'checked': '' }}>
    </div>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_global_sharing_no">No</label>
        <input type="radio" class="form-control" id="consent_for_global_sharing_no" name="consent_for_global_sharing" value="0" {{ old('consent_for_global_sharing') === '0' ? 'checked': '' }}>
    </div>
</div>

<div class="form-group row">
    <label for="consent_for_research" class="col-md-4 col-form-label text-md-right">Consent For Research <a href="#" data-toggle="modal" data-target="#consentForResearch"><i class="fas fa-question-circle"></i></a></label>
    <?php dump(old('consent_for_research')); ?>
    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_research_yes">Yes</label>
        <input type="radio" class="form-control" id="consent_for_research_yes" name="consent_for_research" value="1" {{ old('consent_for_research') === '1' ? 'checked': '' }}>
    </div>

    <div class="col-sm-2">
        <label class="form-check-label" for="consent_for_research_no">No</label>
        <input type="radio" class="form-control" id="consent_for_research_no" name="consent_for_research" value="0" {{ old('consent_for_research') === '0' ? 'checked': '' }}>
    </div>
</div>

检查两个单选框是否都被选中？

1 个答案: