是否可以使用 CSS 为禁用的 INPUT 元素设置样式？答案

【问题标题】：Is it Possible to Style a Disabled INPUT element with CSS?是否可以使用 CSS 为禁用的 INPUT 元素设置样式？
【发布时间】：2011-06-29 21:46:08
【问题描述】：

我需要设置 disabled <select>elements 的样式，使它们看起来像是已启用。有人可以帮忙吗？

PS。我非常清楚做这种事情相对于 HCI 原则等的缺点，但这是一项要求，所以如果可能的话，我必须这样做......

谢谢。

编辑：

@AlexThomas 的方法在 HTML 代码中禁用元素时效果很好，但不幸的是我正在使用 JQuery 进行禁用/启用：

<select class='dayselector'>
    <option>Monday</option>
    <option>Tuesday</option>
    <!-- .... etc. -->
</select>

$(".dayselector").attr("disabled",true);

$(".dayselector").attr("disabled",false);

所以选择器：

$(".dayselector")  //works and gets all the selects

和

$(".dayselector option")  //works and gets all the selects' option items

但是
$(".dayselector [disabled='true']") //doesn't return anything.

和

`$(".dayselector [disabled='false']")  //doesn't return anything.

我有什么遗漏吗？

【问题讨论】：

标签： html css forms css-selectors

【解决方案1】：

使用 jquery：

$('option[disabled="true"]').each(function () {
                 $(this).attr('style', 'color:red');
});

在此处查看实际操作http://jsfiddle.net/GfNve

【讨论】：

你先生是一个&star;！我只希望我能给你更多的选票 :-) 非常感谢，看起来不错！
该死的。当元素在 HTML 中以声明方式禁用时效果很好，但当它们通过 JQuery 禁用时效果很好，这就是我正在做的。请参阅上面的编辑 - 非常感谢您的建议。
当你在 jquery 中设置 disable 时也设置样式。
Ser-weeet！非常感谢 :-) 我不完全确定为什么这会有所作为，但谁在乎呢，它工作得很好。
$('option:disabled').attr('style', 'color:red');

【解决方案2】：

也许您应该使用readonly 而不是disabled。这将启用输入，但不允许用户更改其值。

【讨论】：

我提出了这个建议，但是该字段需要直接不可编辑 - 而是有设置它们的“主”控件。
那些主控不是可以设置为只读而不是禁用吗？ :)
我再说一遍：我不希望选择可以直接编辑。所以 readonly 不会这样做，因为它们会保持可变。
如果它们是只读的，它们如何变化？只读意味着不可编辑。
但是，这是关于选择的。关于复选框的花絮对于任何阅读 cmets 的人来说都是免费的。否决票是因为这个答案完全错误。

【解决方案3】：

你可以选择

select[disabled] {  }

（

或

select:disabled {  }

（

【讨论】：