Question

我有一个复选框和两个单选按钮。在其中一个收音机的更改事件中，我正在复选框的复选属性为true。它只工作一次。

Demo

步骤复制它， 1.点击丑陋（勾选复选框） 2.取消选中该复选框 3.toggel btw丑陋和好（没有效果:(

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

Answer 1

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

使用prop()方法代替attr()方法更新checked属性。
通常绑定更改事件处理程序并根据选定的单选按钮值更新属性。

// 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>

Answer 2

如果条件.clicked单选按钮值不好，请点击为true，否则{at} false会出现在check attr中。您应该使用prop()方法代替attr

<强>更新

为什么不工作？
你的选择器是错的。你有$('input[type=radio][value = "bad"]')。只选择值坏的无线电按钮不适用于两者。仅当您单击其他单选按钮时复选框未取消选中

$(document).ready(function() {
  $('input[type=radio]').on('change', function() {
    $('.xyz').prop('checked',   $(this).val().trim() == 'bad');
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script data-require="jquery" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.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><br>

单选按钮更改事件后未检查复选框

2 个答案: