0

我有一个具有不同权限的用户的下拉列表。用户的不同权限是查看、编辑或删除。从下拉列表中选择用户时，复选框应根据他们拥有的权限进行更新。我试过使用 .prop() 和 .attr() 无济于事。http://jsfiddle.net/DWM4r/

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

jQuery

     $('.user3').click(function() {
          $('.viewChk').attr('checked', true);
          $('.editChk').attr('checked', false);
      $('.delChk').attr('checked', false);
     });
     $('.user2').click(function() {
          $('.viewChk').prop('checked', true);
          $('.editChk').prop('checked', true);
          $('.delChk').prop('checked', false);
     });
     $('.user1').click(function() {
          $('.viewChk').prop('checked', true);
          $('.editChk').prop('checked', true);
          $('.delChk').prop('checked', true);
     });
4

2 回答 2

2

.prop是设置复选框的正确方法。

您的事件没有被触发，因为点击事件没有触发。

试试看.change，注意我调整了options 以将数据作为value属性而不是class属性。确保默认选择选择和默认复选框匹配（就像在您的示例中与 user1 一样）或手动触发$('.select210').change()

.prop('disabled', true)如果要禁止用户更改这些默认值，您可能还需要设置。

小提琴

<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;
  }
});
于 2013-10-10T16:16:25.643 回答
0

试试这个解决方案您必须为选择输入设置 onchange 事件而不是单击。

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

对其他应用相同。

于 2013-10-10T16:27:31.013 回答