Question

我希望在更改时获得所选无线电字段的值。如果所选值为Admin，我想要禁用标识为permissions_forms的字段组，并应检查其中的所有复选框。否则，如果值不是Admin，则应启用它们。

我试图获得价值，但改变的功能在我的情况下不起作用。请问有人可以帮助我吗？这是Jsfiddle

这是HTML代码：

<ul class="radio" id="role">
  <li>
    <input id="role-0" name="role" type="radio" value="User">
    <label for="role-0">User</label>
  </li>
  <li>
    <input checked="" id="role-1" name="role" type="radio" value="Admin">
    <label for="role-1">Admin</label>
  </li>
</ul>
<br/><br/><br/><br/>
<ul class="checkbox" id="permissions_forms">
  <li>
    <input checked="" id="diagnsosis_forms-0" name="diagnsosis_forms" type="checkbox">
    <label for="diagnsosis_forms-0"> Checkbox enable when admin selected</label>
  </li>
  <li>
    <input checked="" id="diagnsosis_forms-1" name="diagnsosis_forms" type="checkbox" >
    <label for="diagnsosis_forms-1"> Checkbox enable when admin selected</label>
  </li>
</ul>

和jQuery代码：

$('#role').change(function() {
  selected = $('input[name=role]:checked').val();
  if (selected == "Admin") {
    alert('Admin');
    $("#permissions_forms :input").attr("disabled", true);
    $("#permissions_forms").parent().siblings().find(':checkbox').attr('checked', this.checked);
  }
  else{
  $("#permissions_forms :input").attr("disabled", false);
  }
});

Answer 1

班级或ID？

不要为多个元素分配相同的ID。 Id应该是唯一的。改为使用类。

<div id="im-unique">Earth</div>

<div class="im-not-unique">Star 1</div>
<div class="im-not-unique">Star 2</div>

如何使用jquery切换属性disabled和checked？

如果所选值是Admin，我想要禁用ID为permissions_forms的字段组，并且应该检查其中的所有复选框。

$checkboxes.prop({ "disabled": true, 'checked': true});将禁用并选中复选框。

为什么prop不是attr？

来自jquery的doc：

要检索和更改DOM属性，例如表单元素的已检查，已选择或已禁用状态，请使用.prop（）方法。

function onChange() {
  var selected = $('input[name=role]:checked').val();
  var $checkboxes = $("#diagnsosis_forms-0, #diagnsosis_forms-1", "#permissions_forms");
  if (selected == "Admin") {
    $checkboxes.prop({ "disabled": true, 'checked': true});
  }
  else {
    $checkboxes.prop("disabled", false);
  }
}
onChange()
$('#role').change(onChange);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="radio" id="role">
  <li>
    <input id="role-0" name="role" type="radio" value="User" class="">
    <label for="role-0">User</label>
  </li>
  <li>
    <input checked="" id="role-1" name="role" type="radio" value="Admin">
    <label for="role-1">Admin</label>
  </li>
</ul>
<br/><br/><br/><br/>
<ul class="checkbox" id="permissions_forms">
  <li>
    <input checked="" id="diagnsosis_forms-0" name="diagnsosis_forms" type="checkbox">
    <label for="diagnsosis_forms-0"> Checkbox enable when admin selected</label>
  </li>
  <li>
    <input checked="" id="diagnsosis_forms-1" name="diagnsosis_forms" type="checkbox" >
    <label for="diagnsosis_forms-1"> Checkbox enable when admin selected</label>
  </li>
</ul>

使用jquery获取已检查单选按钮的值

1 个答案: