CSS 我怎样才能使禁用的字段变灰？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7224604/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how can I greyout a disabled field?
提问by Java Ka Baby
Might not be a JSF issue but JSF experts would know this possibly more
I have some fields on the form that are getting enabled disabled based on some ajax requests . I want to show them greyed out when disabled.
可能不是 JSF 问题，但 JSF 专家可能会更了解
我在表单上有一些字段根据某些 ajax 请求被禁用。我想在禁用时将它们显示为灰色。
Let me know you need to see code but just using simple
让我知道您需要查看代码，但只需使用简单的
<f:ajax event="keydown" execute="@this" render="field1 field2" />
field 1 the has
字段 1 有
disabled="#{not empty someBean.someProperty}"
CSS is
CSS 是
#content input .disabled {color: #DCDAD1; padding: 2px; margin: 0 0 0 0;background-image=""}
Disabling itself is working fine but not getting greyed out
禁用本身工作正常但不会变灰
Thanks and applogies if JSF tag is not correct tag
如果 JSF 标签不是正确的标签，谢谢和应用
回答by BalusC
The JSF input component's disabledattribute doesn't emit a style class like class="disabled"or something like as your CSS declaration seems to expect. It just sets the HTML-standard disabledattribute on the generated HTML element. To see it with your own eyes, open the JSF page in your favourite browser, rightclick and View Source. It'll look something like
JSF 输入组件的disabled属性不会class="disabled"像您的 CSS 声明所期望的那样发出类似或类似的样式类。它只是disabled在生成的 HTML 元素上设置 HTML 标准属性。要亲眼看看，请在您喜欢的浏览器中打开 JSF 页面，右键单击并查看源代码。它看起来像
<input type="text" disabled="disabled" />
You need to use the CSS attribute selector element[attrname]. If the attribute with attrnameis present on the element, then the style will be applied.
您需要使用 CSS 属性选择器element[attrname]。如果attrname上存在with 属性element，则将应用该样式。
#content input[disabled] {
color: #DCDAD1;
padding: 2px;
margin: 0 0 0 0;
background-image: none;
}
(please note that I fixed the background-imagedeclaration as well as it was invalid)
（请注意，我修复了background-image声明并且它是无效的）
