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

Question

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

element.className= 'recordInputEdited';

但是，它无法摆脱 :focus 样式，新类在文本框失去焦点之前一直可见。有什么想法吗？

Answer 1

这应该有效: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;
}