Question

我需要设置 disabled <select>元素的样式，使它们看起来像是已启用。有人可以帮忙吗？

PS。我非常清楚在HCI原则等方面做这种事情的缺点，但这是一个要求所以如果有可能的话我必须这样做......

感谢。

编辑：

@AlexThomas'方法在HTML代码中禁用元素时效果很好但不幸的是我正在使用JQuery进行禁用/启用：

<select class='dayselector'>
    <option>Monday</option>
    <option>Tuesday</option>
    <!-- .... etc. -->
</select>

$(".dayselector").attr("disabled",true);

$(".dayselector").attr("disabled",false);

所以选择器：

$(".dayselector")  //works and gets all the selects

和

$(".dayselector option")  //works and gets all the selects' option items

但
$(".dayselector [disabled='true']") //doesn't return anything.

和

`$(".dayselector [disabled='false']")  //doesn't return anything.

我有什么遗失的吗？

Answer 1

你可以选择

select[disabled] {  }

（＆lt; IE7不支持）

或

select:disabled { }

（＆lt; IE9中不支持）

Answer 2

也许您应该使用readonly代替disabled。这将使输入启用，但不允许用户更改其值。

Answer 3

使用jquery：

$('option[disabled="true"]').each(function () {
                 $(this).attr('style', 'color:red');
});

在这里检查http://jsfiddle.net/GfNve

是否可以使用CSS设置已禁用的INPUT元素？

3 个答案: