如何使用 jquery 启用或禁用基于 2 个其他单选按钮的单选按钮?

How to enable or disable a radio based on 2 other radio buttons using jquery?

我有 3 个单选按钮

<div>
<input class="crm-form-radio" value type="radio" id="CIVICRM_QFID_is_recur_radio" name="is_recur_radio">
<label for="CIVICRM_QFID_is_recur_radio">Single</label>
</div>

<div>
<input class="crm-form-radio" value="month" type="radio" id="CIVICRM_QFID_month_is_recur_radio" name="is_recur_radio">
  <label for="CIVICRM_QFID_month_is_recur_radio">Month</label>
</div>

<div>
<input class="payment_processor_gocardless crm-form-radio" value="5" type="radio" id="CIVICRM_QFID_5_payment_processor_id" name="payment_processor_id" >
<label for="CIVICRM_QFID_5_payment_processor_id">Payment</label>

</div>

我想要的结果是,当我 select Single 时, Payment 无线电应该被禁用。

当我select每月时,支付收音机应该被启用

这是我尝试过的并且能够成功禁用 payment 收音机,但是在 select Monthly[=27] 时无法启用它=].任何帮助,将不胜感激。谢谢

$('input[name=is_recur_radio][id=CIVICRM_QFID_is_recur_radio]').change(function(){
if ($("input[name=is_recur_radio]:checked").attr("id")=="CIVICRM_QFID_is_recur_radio") {
    $('input[name=payment_processor_id][value=5]').prop("disabled", true);
    }
  });


$('input[name=is_recur_radio][value=month]').change(function(){
if ($("input[name=is_recur_radio]:checked").attr("value")=="CIVICRM_QFID_month_is_recur_radio") {
    $('input[name=payment_processor_id][value=5]').prop("disabled", false);
    }  
});

因为您的两个无线电名称即:monthly and single 相同,您可以只使用一个 change 事件处理程序并根据条件更改值。

演示代码 :

$('input[name=is_recur_radio]').change(function() {
  //check for id and add or remove disabled
  $("input[name=is_recur_radio]:checked").attr("id") == "CIVICRM_QFID_is_recur_radio" ? $('input[name=payment_processor_id][value=5]').prop("disabled", true) : $('input[name=payment_processor_id][value=5]').prop("disabled", false);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <input class="crm-form-radio" value type="radio" id="CIVICRM_QFID_is_recur_radio" name="is_recur_radio">
  <label for="CIVICRM_QFID_is_recur_radio">Single</label>
</div>

<div>
  <input class="crm-form-radio" value="month" type="radio" id="CIVICRM_QFID_month_is_recur_radio" name="is_recur_radio">
  <label for="CIVICRM_QFID_month_is_recur_radio">Month</label>
</div>

<div>
  <input class="payment_processor_gocardless crm-form-radio" value="5" type="radio" id="CIVICRM_QFID_5_payment_processor_id" name="payment_processor_id">
  <label for="CIVICRM_QFID_5_payment_processor_id">Payment</label>

</div>