Javascript 选择选项以选中/取消选中不起作用的复选框？

我有一个具有不同权限的用户下拉列表。用户的不同权限是查看、编辑或删除。从下拉列表中选择用户时，复选框应根据其拥有的权限进行更新。我尝试过使用.prop（）和.attr（）但没有效果

HTML

              <select class='select210'>
                <option class='user1'>wjazi@deloitte.com</option>
                <option class='user2'>aschwem@company.com</option>
                <option class='user3'>tcooksnow@usa.com</option>
              </select>  
              <input type='checkbox' checked class='viewChk' />View
              <input type='checkbox' checked class='editChk' />Edit
              <input type='checkbox' checked class='delChk' />Delete

---

.prop

是设置复选框的正确方法

您的事件未被触发，因为单击事件未触发

尝试

。更改

，注意我调整了

选项

s，使数据作为

值

属性，而不是

类

属性。请确保默认选择和默认复选框匹配（就像在您的user1示例中那样），或者手动触发

$（'.select210'）.change（）

如果不允许用户更改这些默认值，您可能还需要设置

.prop（'disabled'，true）

wjazi@deloitte.com
aschwem@company.com
tcooksnow@usa.com
看法
编辑
删除
$（'.select210'）.change（函数（）{
var值=$（this.val（）；
开关（值）{
案例“user1”：
$（'.viewChk'）.prop（'checked'，true）；
$（'.editChk'）.prop（'checked'，true）；
$（'.delChk'）.prop（'checked'，true）；
打破
案例“user2”：
$（'.viewChk'）.prop（'checked'，true）；
$（'.editChk'）.prop（'checked'，true）；
$（'.delChk'）.prop（'checked'，false）；
打破
案例“user3”：
$（'.viewChk'）.prop（'checked'，true）；
$（'.editChk'）.prop（'checked'，false）；
$（'.delChk'）.prop（'checked'，false）；
打破
}
});

试试这个解决方案 对于select输入，必须设置onchange事件，而不是单击

$( ".user3" ).change(function() {
   $('.viewChk').prop('checked', true);
          $('.editChk').prop('checked', true);
          $('.delChk').prop('checked', false);
          $('.delChk').attr('checked', false);
});

对其他的应用相同的方法

<select class='select210'>
  <option value='user1'>wjazi@deloitte.com</option>
  <option value='user2'>aschwem@company.com</option>
  <option value='user3'>tcooksnow@usa.com</option>
</select>  
<input type='checkbox' checked class='viewChk' />View
<input type='checkbox' checked class='editChk' />Edit
<input type='checkbox' checked class='delChk' />Delete

$('.select210').change(function(){
  var value= $(this).val();
  switch(value){
    case 'user1':
      $('.viewChk').prop('checked', true);
      $('.editChk').prop('checked', true);
      $('.delChk').prop('checked', true);
      break;
    case 'user2':
      $('.viewChk').prop('checked', true);
      $('.editChk').prop('checked', true);
      $('.delChk').prop('checked', false);
      break;
    case 'user3':
      $('.viewChk').prop('checked', true);
      $('.editChk').prop('checked', false);
      $('.delChk').prop('checked', false);
      break;
  }
});

$( ".user3" ).change(function() {
   $('.viewChk').prop('checked', true);
          $('.editChk').prop('checked', true);
          $('.delChk').prop('checked', false);
          $('.delChk').attr('checked', false);
});