javascript - 更改焦点上的文本颜色并在焦点离开后保持该颜色(onblur)

Question

一个 CSS 和 Javascript 问题。我希望交替行具有不同的颜色，默认文本为灰色。但是，一旦输入字段获得焦点，我希望新文本为黑色，然后在该字段不再具有焦点后保持黑色。这是我到目前为止所做的:

input {
   font-family:Verdana, Trebuchet MS;
   font-size:11px;
   vertical-align:top;
}

input:focus {
    color: black;
}

input.odd {
   color: #888;
   background:#FFFFB4;
}

input.even {
   color: #888;
   background:#FFD9C8;
}

此代码实现了我对交替行具有不同颜色和默认文本为灰色的要求。但是，新文本是灰色的，而不是黑色的。那么如何让新文本保持黑色。

更新的 CSS

input {
   font-family:Verdana, Trebuchet MS;
   font-size:11px;
   vertical-align:top;
}

input.odd {
   color: #888;
   background:#FFFFB4;
}

input.even {
   color: #888;
   background:#FFD9C8;
}

input.odd:focus, input.even:focus, input.odd.hasText, input.even.hasText {
    color: black;
}

新的 jQuery 代码

$('input').focus(function() {
   $(this).addClass('hasText');
});

Answer 1

很可能你想要

input.odd:focus,input.even:focus {
    color: black;
}

如果您的意思是文本在失去焦点后恢复为灰色，您可能需要在输入文本后通过 javascript 添加一个类，并让该类与您的焦点类匹配。

编辑

类似于:

$('input').focus(function(){
    $(this).addClass('hasText');
});

然后在你的 CSS 中有:

input.even:focus,input.odd:focus,input.hasText{
    color: black;
}