IE7选择选项文本颜色未正确显示

Question

我正在使用IE7。我有以下CSS规则：

form [disabled] {
    color: #999 !important;
}

在jQuery ready（）事件中，我禁用SELECT中的每个选项：

$('#mySelect option').attr('disabled', 'disabled');

然后再次启用其中一些禁用选项：

('#myOption').removeAttr('disabled');

现在一切都很好看。在这种情况下，除第一个选项外，每个选项都有一个灰色文本。

但是，如果我在页面加载后更改一个选项的disabled属性，例如点击按钮后，颜色不再变化。

如果我使用IE7开发人员工具栏检查选项，我可以清楚地看到已禁用的属性已消失，颜色再次设置为原始颜色（灰色除外），但该选项仍然具有灰色文本。

反过来也是如此。如果我将disabled属性放在之前未禁用的选项上，我可以在开发人员工具栏中看到attrbibute设置，我可以看到颜色设置为CSS中定义的颜色，但我在实际的浏览器窗口中看不到它。还是旧的颜色。

这是一些非常奇怪的行为，我知道IE7有这个错误（或功能？）根本没有处理禁用的表单元素。

但我希望至少在用户不应选择的项目上使用灰色。我无法让它正常工作。

有什么方法可以让它发挥作用吗？

Answer 1

作为一种简单的解决方法，您可以在禁用它们时在元素上设置类disabled。

JS：

$('#mySelect option').addClass('disabled').attr('disabled', 'disabled');

JS：

('#myOption').removeClass('disabled').removeAttr('disabled');

CSS：

form .disabled {
    color: #999 !important;
}