Question

<input class="problem" type="text" value="some text" disabled="disabled">

如何更改“某些文字”的颜色？

upd：CSS的样式仅适用于Chrome＆amp; Mozilla的。我需要支持所有浏览器，包括IE7 +

Answer 1

只需应用一些css样式，例如

.problem {
  color : red;
}

你甚至可以为正常输入和禁用输入定义两种不同的颜色，如下所示;

.problem { color : red; }
.problem[disabled] { color : #cfcfcf; }

示例小提琴：http://jsfiddle.net/dgNZS

在较旧的IE版本上，无法将已禁用的输入元素的颜色更改为answered here，但您可以尝试遵循bobince的解决方法。

Answer 2

您可以更改所有浏览器中所有属性的文本框的禁用样式，但文本的颜色除外，并且仅在IE中。对于IE（对于除文本颜色以外的所有属性），必须将 doctype 设置为4.01 strict，然后使用像

这样的代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
input[disabled], input[readonly] { 
 background-color: green; 
 border: #3532ff 1px solid; 
 color: #00FF00;
 cursor: default; 
}
</style>
</head>
<body>
<form>
<input class="problem" type="text" value="some text" disabled="disabled">
</form>
</body>
</html>

请查看“styling disabled text inputs”

但是，如果你使用 readonly 而不是禁用=“禁用”，就像工程师所写，这也可以在ie。

Answer 3

给它一个样式，即style="color:green"

<input class="problem" type="text" value="some text" disabled="disabled" style="color:green">

或者在您输入的课程中包含此内容。

Answer 4

演示 http://jsfiddle.net/ELuXW/1/

API：CSS - http://api.jquery.com/css/

这应该有帮助，:)

<强>码

$('.problem').css('color', 'blue');

Answer 5

对于跨浏览器解决方案，您需要使用readonly和unselectable属性而不是disabled，并应用以下样式：

.problem[readonly]{
     color: red;
     /*Preventing selection*/
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     /**/
}

标记：

<input class="problem" type="text" value="some text" readonly unselectable="on">

DEMO

更改输入中的值的颜色

5 个答案: