Question

如果用户选择category1单选按钮，则必须更改复选框的值。并在用户选中复选框时显示它们。

如果用户选择了类别2单选按钮，则另一组值将分配给复选框。

如果用户选择了类别3单选按钮，则必须为复选框分配另一组值。

以下是代码：

$(document).ready(function() {
  $('input[type="radio"]').click(function() {
    if ($('input[id="radio1"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', 5000);
    } else if ($('input[id="radio2"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', 10, 000);
    } else if ($('input[id="radio3"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', 25, 000);
    }
  });

  $('input[type="checkbox"]').click(function() {
    $("#output").show();

    if ($('input[name="checkbox1"]').prop("checked") == true) {
      type1 = $('input[name="checkbox1"]').val()
      $("#output").html(type1);
    } else if ($('input[name="checkbox1"]').prop("checked") == false) {
      $("#output").hide()
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="radio" id="radio1">category1<br/>
<input type="radio" id="radio2">category2<br/>
<input type="radio" id="radio3">category3<br/>
<br/><br/>
<input type="checkbox" name="checkbox1">type1<br/>
<input type="checkbox" name="checkbox2">type2<br/>
<input type="checkbox" name="checkbox3">type3<br/>

<span id="output"></span>

Answer 1

你需要给你的收音机命名相同：

<input type="radio" id="radio1" name="category">category1<br/>
<input type="radio" id="radio2" name="category">category2<br/>
<input type="radio" id="radio3" name="category">category3<br/>

然后你应该在attr()赋值中用引号包装值：

if ($('input[id="radio1"]').prop("checked") == true) {
    $('input[name="checkbox1"]').attr('value', '5000');
} else if ($('input[id="radio2"]').prop("checked") == true) {
  $('input[name="checkbox1"]').attr('value', '10,000');
    _________________________________________^______^
} else if ($('input[id="radio3"]').prop("checked") == true) {
  $('input[name="checkbox1"]').attr('value', '25,000');
    _________________________________________^______^
}

代码：

$(document).ready(function() {
  $('input[type="radio"]').click(function() {
    if ($('input[id="radio1"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', '5000');
    } else if ($('input[id="radio2"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', '10,000');
    } else if ($('input[id="radio3"]').prop("checked") == true) {
      $('input[name="checkbox1"]').attr('value', '25,000');
    }
  });

  $('input[type="checkbox"]').click(function() {
    $("#output").show();

    if ($('input[name="checkbox1"]').prop("checked") == true) {
      type1 = $('input[name="checkbox1"]').val()
      $("#output").html(type1);
    } else if ($('input[name="checkbox1"]').prop("checked") == false) {
      $("#output").hide();
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="radio1" name="category">category1<br/>
<input type="radio" id="radio2" name="category">category2<br/>
<input type="radio" id="radio3" name="category">category3<br/>
<br/><br/>
<input type="checkbox" name="checkbox1">type1<br/>
<input type="checkbox" name="checkbox2">type2<br />
<input type="checkbox" name="checkbox3">type3<br/>
<span id="output"></span>

使用单选按钮更改复选框值

1 个答案: