javascript - 用户输入时如何更改输入文本的边框颜色

Question

边框颜色将取决于当前键入的值。当 onkeypress 事件发生时，我尝试使用 javascript 更改输入文本的类名，

element.className= 'recordInputEdited';

但是，它无法摆脱 :focus 样式，新类在文本框失去焦点之前是可见的。任何想法？

Answer 1

使用 CSS，您可以：

input:focus {
    border:1px solid red;
} 

Answer 2

这应该工作：http: //jsfiddle.net/GQSsw/

HTML：

<input id="element" />

Javascript：

document.getElementById('element').onkeydown = function() {
    this.className= 'edited';
}

CSS：

input {
    border: 1px solid red;
}

input:focus {
    border: 1px solid green;
}

input.edited {
    border: 1px solid yellow;
}