html - 更改表单中下拉占位符的颜色

标签 html css forms

我正在制作带有下拉元素的表单。我希望占位符文本为灰色,就像在“文本输入”表单中一样,而答案为黑色。

我设法在下拉菜单中将答案设为另一种颜色,但是当您选择它时,它会变为占位符的颜色。

我正在使用的代码;

<select class="remindmedropdown">
<option value="0" selected disabled>QUESTION</option>
<option value="1">Answer 1</option>
<option value="2">Answer 2</option>
<option value="3">Answer 3</option>
</select>

CSS:

.remindmedropdown {
width: 240px;
height: 40px;
background-color: #FFF;
padding: 10px;
margin-right: 30px;
outline-color:#A7D5E4;
color:#990000;
}



.remindmedropdown option { color: gray; }

编辑:jsfiddle http://jsfiddle.net/QkYC9/1/

最佳答案

将此脚本添加到您的页面:

<script type="text/javascript">
    function changeColor(dropdownList){
        if (dropdownList.value > 0) {
            dropdownList.style.color = 'black';
        }
    }       
</script>

然后,对于您想要使用它的任何下拉菜单,添加对“changeColor”函数的引用,如下所示:

<select class="remindmedropdown" onChange="changeColor(this)">

脚本元素应该在 <head> 之间和 </head>在你的文档中

关于html - 更改表单中下拉占位符的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16348767/

相关文章:

html - 如何在 Weebly 中更改 ul - list-style-image。

javascript - 有没有办法用javascript清除页面?

调查问卷的 Javascript 单选按钮计数和计算

c# - 如何在 Visual C# .NET Web 元素中添加对所有 Web 窗体的 CSS 样式表引用

javascript - 将表单数据发送到嵌套在 div 中的页面

javascript - Django - 表单输入字段未发布

javascript - 引用 .click() 仅在短时间内显示目的地

javascript - 是否可以制作一个自动将文本颜色更改为背景对比度的 Javascript 程序?

c# - 根据另一个属性在 View 中显示模型属性的最佳实践

php - css 和 js 文件未在 codeigniter 中使用 $this->load->view 加载