javascript - javascript形式的不同类(textcolor)

标签 javascript html css class colors

我遇到的问题是我无法在以下 javascript 表单中设置两种不同的文本颜色(通过 css 类)。标准类是灰色(灰色文本颜色),但是一旦有人点击“在此处输入您的邮件”,要输入的电子邮件颜色文本应该是黑色的。 (黑色类)。有人可以帮助我吗?

<form name="mainform" method="post">
     Your email: <input type="text" size="40" class="grey" name="email" value="{{ fields.email.input }}" onclick="ClearIfAppropriate();">{{ fields.email.error }} &nbsp; <input type="submit" name="submit" value="Go">
</form>
<script type="text/javascript" language="JavaScript"><!--
    var LabelText = "Type your email here";
    if(document.mainform.email.value.length == 0) {
        document.mainform.email.value = LabelText;
    }
    function ClearIfAppropriate() {
        if(document.mainform.email.value == LabelText) {
            document.mainform.email.value = "";
            document.mainform.email.class = "black";
        }
    }
//--></script>

CSS 类

.grey {
    color: grey;
}

.black {
    color: black;
}

最佳答案

这在纯 CSS 中很容易实现,不需要 javascript:

input.grey:focus
{
   color: #000;
}

虽然我认为ie<8不支持伪类:focus

关于javascript - javascript形式的不同类(textcolor),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4932618/

相关文章:

html - 如何在声明它的同一规则中使用 CSS 变量

css - angularjs 中的类型错误

javascript - 查找修改后的 CSS/JS 属性

JavaScript 文本输入验证不起作用

javascript - HTML/CSS : Focus a paragraph

PHP html 电子邮件,使用 html 模板

css - Safari css 旋转 3d 分层问题

javascript - 如何移动 d3 AlbersUSA 投影中的状态?

javascript - 使用微调器单击按钮上的 BlockUI

html - 2个div在页面上并排居中