选择标记颜色不显示在Firefox中

我有一个简单的选择下拉菜单的网页，其中每个选项元素具有不同的颜色。展开后，颜色在Firefox（8.0）中显示正常，但只要您单击某个选项并且列表关闭，颜色就会变回黑色。选择标记颜色不显示在Firefox中

在撰写摘要网页时，颜色很重要。

这个问题似乎没有出现在IE

<select name='STATUS' style='width:100px'> 
    <option value='NS' style='color:blue'>Not Started</option> 
    <option value='Started' style='color:Green'>Started</option> 
    <option value='Finished' style='color:red'>Finished</option> 
</select>

来源

2012-07-19 user1537237

的color声明只会影响您的option元素，没有选择的选择。所选选项的样式取决于您的select元素的样式。你必须改变使用JavaScript select元素的颜色，以达到你所期望的行为：

<select class="colorchange" name='STATUS' style='width:100px;'> 
    <option value='NS' style='color:blue'>Not Started</option> 
    <option value='Started' style='color:Green'>Started</option> 
    <option value='Finished' style='color:red'>Finished</option> 
</select>

function selectColorChanger(){ 
    this.style.color = this.options[this.selectedIndex].style.color; 
} 

// this will affect all selects which have the "colorchange" class applied 
var selects = document.getElementsByClassName("colorchange"); 
var i; 

for(i = 0; i < selects.length; ++i){ 
    selects[i].onchange = selectColorChanger; 
}

Demo

来源

2012-07-19 09:00:23 Zeta

感谢您的答复，代码的作品，但我需要一个解决方案，它有一个选择颜色时加载页面，以便人们可以看到状态尽快因为他们加载页面。我将在代码中添加以在页面加载后自动选择正确的选项 – user1537237 2012-07-19 09:49:35

我提出的解决方案是使用PHP为选择标签本身添加一个style =“color：$ COLOR”元素。由于当前状态在呈现页面时被保存在数据库中，因此我检查当前处于活动状态，并相应地设置$ COLOR var。感谢您的帮助。 Shame Firefox并不像IE浏览器Chrome那样自动渲染它。 – user1537237 2012-07-19 10:05:44

的解决方案，我想出了使用PHP来添加样式=将“color：$ COLOR”元素添加到选择标签本身。
由于当前状态在呈现页面时保存在数据库中，因此我检查当前处于活动状态，并相应地设置$ COLOR var。

感谢您的帮助。耻辱Firefox不会自动渲染它像IE浏览器铬等

来源

2012-07-20 12:36:44 user1537237

选择标记颜色不显示在Firefox中

回答

相关问题