我可以使用 CSS 或脚本设置禁用控件的样式吗？答案

【问题标题】：Can I style a disabled control using CSS or script?我可以使用 CSS 或脚本设置禁用控件的样式吗？
【发布时间】：2009-12-08 15:35:12
【问题描述】：

我的页面上有一个 HTML div 元素，当页面上的 select 元素更改时，该元素会更新。有时需要根据选择禁用input 标签（文本框）。

问题是：项目利益相关者喜欢该功能，他们只是认为处于“禁用”状态，文本框内容太轻，因此无法阅读。我可以将 CSS 应用于禁用的控件吗？或者我应该将文本框设置为 readonly 并使用其他一些 CSS。如果有帮助的话，这个应用程序也在使用 jQuery。这里有什么想法或建议？

【问题讨论】：

标签： jquery html css

【解决方案1】：

input[type="submit"][disabled="disabled"]
{
    /* CSS here */
}
input[type="text"][disabled="disabled"]
{
    /* CSS here */
}
input[type="button"][disabled="disabled"]
{
    /* CSS here */
}

如果输入标签类似于以下内容，则适用于所有浏览器：

<input type="submit" disabled="disabled">

如果你想在它未被禁用时更改它，只需将其添加到你的 CSS 中

input[type="submit"]
{
    /* CSS here */
}
input[type="text"]
{
    /* CSS here */
}
input[type="button"]
{
    /* CSS here */
}

【讨论】：

【解决方案2】：

是的，你可以。在 CSS 中：

input[disabled]{color:green}

或者 jQuery：

$('input[disabled]').css('color','green');

更新：这只适用于 gecko/webkit。

【讨论】：

+1。我有一个<input type="image" ...>，当使用 jQuery 设置/重置 disabled 属性时，它的样式不正确。 input[disabled='disabled'] (css) 在这种情况下不起作用。 input[disabled] 做到了。

【解决方案3】：

对元素应用 CSS 不受该元素是否被禁用的影响。

【讨论】：

【解决方案4】：

我会将它们设置为只读，因为显然您希望人们能够阅读它们，人们可能还希望从中选择文本进行复制/粘贴，并且当文本框被禁用时，选择也会被禁用.但是，无论元素是否被禁用，您的 CSS 都应该可以正常工作。

【讨论】：

【解决方案5】：

如果您在禁用元素中使用不可覆盖的样式时遇到问题 - Upper Stage 指出样式没有限制，然后再想他可能是对的 - 您最好给控件一个 @ 987654321@ 属性并使用onfocus='this.blur();'“手动禁用”它

请注意，这不会像禁用控件那样 100% 工作：它的值将与表单一起提交。

【讨论】：