javascript - 单选按钮更改事件后未选中复选框

Question

我有一个复选框和两个单选按钮。在其中一个 radio 的更改事件中，我将复选框的选中属性设置为 true。它只工作一次。

Demo

复制它的步骤，1.点击丑陋(复选框被选中)2.取消选中复选框3.toggel btw 丑陋但很好(没有效果 :(

在这上面花了很多时间，但无法弄清楚发生了什么。

Answer 1

按如下方式更新您的代码:

1. 使用prop()方法而不是 attr()更新 checked 属性的方法。
2. 共同绑定(bind)更改事件处理程序，并根据选定的单选按钮值更新属性。

// or select based on the name attribute
// `$('input[type=radio][name="gender"]')`
$('input[type=radio]').on('change', function() {
  $('.xyz').prop('checked', this.value == 'bad');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="Car" class="xyz"> I have a car<br>


<input type="radio" name="gender" value="good"> Good Oned<br>
<input type="radio" name="gender" value="bad"> Ugly<br>