只是为了抢占“你为什么要这样做”的答复，这就是我正在做的事情：
如果单击另一个控件，我会进行 ajax 调用以获取服务器生成的值并将其填充到文本框中。然后，我在客户端将控件设置为 readOnly（我不想将控件禁用，因为我需要它回发，所以我设置了 readOnly 属性）。
不幸的是 readOnly 它并没有看起来“禁用”
我想通过 .addClass 获得禁用的文本框外观。
我已经尝试过各种风格，但我离那种风格还差得很远。
顺便说一下，这将在 IE 中（可能是 IE7 或更低版本，所以恐怕没有大纲样式）。
感谢您的任何想法。
【问题讨论】：
标签： asp.net javascript css
我知道这已被回答，但想给出我的 CSS 示例。
因为当我在寻找解决方案时，如何设置输入字段的样式以使其看起来像是被禁用，所以我总是以这样的输入字段结束。
左边框和上边框颜色较深等。 所以使用这个 CSS 代码解决了它。
input[readonly]{
border-color: darkgrey;
border-style: solid;
border-width: 1px;
background-color: rgb(235, 235, 228);
color: rgb(84, 84, 84);
padding: 2px 0px;
}
发了jsfiddle，这样你们就可以仔细看看了。
在 Chrome 上看起来不错，在其他浏览器上你需要修改颜色。像在 Firefox 中一样，您也需要将颜色和背景颜色更改为等。
background-color: rgb(240, 240, 240);
color: rgb(109, 109, 109);
【讨论】：
我在相关的answer 上发现了这条评论：
要使“只读”输入字段看起来像“禁用”字段，请设置 'style="color: gray; background-color: #F0F0F0;"'。 – 丹尼森鲍姆 2011 年 2 月 28 日 5:05
我试过了，效果很好！
总结一下：
style="color: grey; background-color: #F0F0F0;"
【讨论】：
我刚刚玩过它。我正在使用 JS 和 JQuery 禁用输入项。在一个表单上，我有一个带有“disabler”类的复选框和将被禁用的项目，这些项目标有“disable”类。
面临与您相同的问题并解决了它使用 JQuery DOM 操作即时放置和删除隐藏字段。在所有浏览器中都能正常工作。
该函数与disabler.onClick和form.onLoad绑定：
$.My.InitDisabler = function() {
if (!$('.disabler').attr('checked')) {
$('.disableable').each(function() {
$(this).attr("disabled", "true");
var templ = '<input name="{0}" type="hidden" value="{1}" class="disable_hdn" />';
$(this).after($.format(templ, $(this).attr("name"), $(this).val()));
});
}
else {
$('.disable_hdn').remove();
$('.disableable').removeAttr("disabled");
}
}
【讨论】：
我可以想到两种方法。
【讨论】：
我不想控制被禁用，因为我需要它来回发，所以我设置了 readOnly 属性
将其设置为禁用，并创建一个具有相同名称且包含相同值的隐藏输入来进行真正的提交。
这是一个 hack，但要在所有浏览器中可靠地获得正确的“禁用”外观的唯一方法是真正使用“禁用”。跨平台、浏览器、设置和主题的样式太不一致，您无法可靠地复制它。
【讨论】：
禁用的表单元素看起来因浏览器而异。如果您不希望您的网站看起来不一致和草率，那么您应该设置所有输入元素的样式，或者至少设置所有复选框 - 启用、禁用和只读。然后，您可以确定只读输入的外观，而无需尝试匹配四五个不同的浏览器。
【讨论】：
最好的方法是以正常方式禁用文本框，然后截取页面的屏幕截图并将其加载到图像编辑器程序中并获取文本框背景颜色、边框颜色等。然后您可以通过以下方式设置它像这样的CSS：
input.readOnlyTextBox
{
background-color: #F2F2F2 !important;
color: #C6C6C6;
border-color: #ddd;
}
请记住，虽然不同浏览器的禁用外观可能看起来略有不同，但这将为您提供大致的禁用外观。
【讨论】：