单选按钮管理-当我选择一个时，它会自动选择另一个jQuery

Question

我有4个单选按钮，我想当我点击一个(或设置为在开始时自动选择)，这样当我选择DeliveryYesSingle时，它会自动选择deliveryYesSingleBoard。但是这个函数不像在If choose " If selected">

中那样工作jQuery:

*
if(jQ('[id="DeliveryYesSingle"]').is(':checked')){
jQ('[id="deliveryYesSingleBoard"]').prop('checked', true);

};
if(jQ('[id="DeliveryNoSingle"]').is(':checked')){
jQ('[id="DeliveryNoSingleBoard"]').prop('checked', true);
};

HTML:

<div class="row gutters">
<div class="col col-2">
<div class="form-item form-checkboxes">
<input type="radio"   id="DeliveryYesSingle" name="deliveryCredit"   value="yes"/><label data-timtranslationlabel="" for="deliveryCredit_Yes" class="checkbox" >Delivery on credit</label>
</div>
</div>
<div class="col col-2">
<div class="form-item form-checkboxes">
<input type="radio" id="DeliveryNoSingle" name="deliveryCredit" value="no"/><label data-timtranslationlabel="" for="deliveryCredit_No" class="checkbox" >Advance payment to supplier</label>
</div>
</div>
</div>
<div class="section" id="DeliveryOnCreditBoard" >    
<div class="row gutters">
<div class="col col-2">
<div class="form-item form-checkboxes">
<input type="radio" id="deliveryYesSingleBoard" name="deliverySingle"   value="yes"/><label data-timtranslationlabel="" for="deliveryYesSingleBoard" class="checkbox" >Delivery on credit</label>
</div>
</div>
<div class="col col-2">
<div class="form-item form-checkboxes">
<input type="radio"  id="DeliveryNoSingleBoard" name="deliverySingle"  value="np"/><label data-timtranslationlabel="" for="DeliveryNoSingleBoard" class="checkbox" >Advance payment to supplier</label>
</div>
</div>
</div>
</div>

https://jsfiddle.net/Palucci92/w4djnhgb/3/

Answer 1

这两个if语句将在页面加载后立即运行，并且只有一次。不应该使用if语句来检查用户输入，例如选择单选按钮。您需要在想要检查用户输入的两个单选按钮上注册一个事件，例如:

jQ('[id="DeliveryYesSingle"]').on('change', () => {
});

在这种情况下，change事件用于检测何时选中单选按钮(参见https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)。

在回调函数块中(在花括号内)，您可以执行.prop()调用来更改其他单选按钮的属性。