html - 如何设置禁用复选框的样式？

您知道禁用复选框时如何设置样式吗？

例如。:

<input type="checkbox" value="All Terrain Vehicle"
       name="exfilter_All Terrain Vehicle"
       id="exfilter_All_Terrain_Vehicle"
       class="exfilter" disabled="">

最佳答案

在CSS中使用属性选择器

input[disabled]{
  outline:1px solid red; // or whatever
}

复选框专用

input[type=checkbox][disabled]{
  outline:1px solid red; // or whatever
}

$('button').click(function() {
  const i = $('input');

  if (i.is('[disabled]'))
    i.attr('disabled', false)
  else
    i.attr('disabled', true);
})

input[type=checkbox][disabled] {
  outline: 2px solid red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" value="tasd" disabled />
<input type="text" value="text" disabled />
<button>disable/enable</button>

关于html - 如何设置禁用复选框的样式？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/4271463/