Question

我有两组单选按钮。单击组中的按钮时，应取消选中另一组中的任何按钮，反之亦然。

我认为最聪明的方式就是onclick。但我无法理解它。有什么建议吗？

[radio button 1 name="a"]
[radio button 2 name="a"]
[radio button 3 name="a"]

[radio button 1 name="b"]
[radio button 2 name="b"]
[radio button 3 name="b"]

由于射线

Answer 1

试试这个： -

function disableRadioBtnSet(){
  if ($('[name="a"]').is(':checked')){
    $('input[name="b"]').attr("disabled",true);
  }else{
    $('input[name="a"]').attr("disabled",true);
  }
}

$("input[name='a']").change(function(){
   disableRadioBtnSet();
});
$("input[name='b']").change(function(){
   disableRadioBtnSet();
});

DEMO JSFIDDLE

Answer 2

The following seems to work only once then not anymore. The function should uncheck the other group of radio buttons on click and vice versa.

Any suggestions? Many thanks

function uncheckRadioBtnSet(){
  if ($('[name="a"]').is(':checked')){
    $('input[name="b"]').removeAttr('checked');
    $(this).off('click');
  }else{
    $('input[name="a"]').removeAttr('checked');
    $(this).off('click');
  }
}

$("input[name='a']").click(function(){
   uncheckRadioBtnSet();
});
$("input[name='b']").click(function(){
   uncheckRadioBtnSet();
});

<input type="radio" name="a"  value="1"><br>
<input type="radio" name="a" value="2"><br>
<input type="radio" name="a"  value="3"><br>
<h6>
separator
</h6>
<input type="radio" name="b" value="4"><br>
<input type="radio" name="b" value="5"><br>
<input type="radio" name="b"  value="6"><br>

使用Javascript取消选中一组单选按钮

2 个答案: