jquery - 根据另一个 radio 设置 radio

Question

我有这个表格:

<form name="test">
<input type="radio" required="required" name="a" value="1">1
<input type="radio" required="required" name="a" value="X">X
<input type="radio" required="required" name="a" value="2">2
<br />
<input type="radio" required="required" name="b" value="1">1
<input type="radio" required="required" name="b" value="2">2
</form>

我想实现这个:

If a=1 then b=1
If a=X then unset b
If a=2 then b=2

我尝试了这个，但没有任何作用:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('#test').on('change', function() {
        if ($("input[name='a']:checked").val()=="1") {
        $( "#b" ).prop( "checked", true );
    }
  });
});
</script>

这里缺少什么？

Answer 1

在名为a的radio按钮上绑定(bind)更改事件，获取其值，在名为b的radio按钮中找到相同的值设置，并查看其属性，如下:

$('input[name="a"]').on('change', function() {
  var selected = $('input[name="a"]:checked').val();
  if (selected == "X") {
    $('input[name="b"]:checked').prop("checked", false);
    return false;
  }
  $('input[name="b"][value="' + selected + '"]').prop("checked", true);

});

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<form name="test">
  <input type="radio" required="required" name="a" value="1">1
  <input type="radio" required="required" name="a" value="X">X
  <input type="radio" required="required" name="a" value="2">2
  <br />
  <input type="radio" required="required" name="b" value="1">1
  <input type="radio" required="required" name="b" value="2">2
</form>

PS: If you wish you can add disabled property to radio button set with name b so that user is not allowed to change them