重置输入控件的边框颜色(HTML/Javascript)

Question

有没有人知道如何使用javascript修改输入控件的边框颜色？通过突出显示其中包含不正确或无效数据的字段等来进行验证.

例如改变边界:

document.getElementById('myinput').style.border = '1px solid red';

怎么重置？下一行完全删除边框...

document.getElementById('myinput').style.border = '';

如果我将边框颜色重置为特定颜色(例如黑色或灰色等),在某些浏览器/操作系统中可能看起来很奇怪,那些"主题"控件......

谢谢堆!

Answer 1

不要使用设置样式属性.通过使用CSS类来做到这一点.我还建议使用Javascript库来处理这个问题.它只是使代码更清晰.

删除CSS属性是有问题的,因为您并不总是知道应该将它们设置回去.添加和删​​除类只是...工作.

每个元素可以有多个类,所以实际上没有反对这样做的论据(imho).

我习惯了jQuery,所以我的例子就是这样.

错误的方法:

$("#myinput").css("border", "1px solid red");

正确的方法:

<style type="text/css">
.redborder { border: 1px solid red; }
</style>

<script type="text/javascript">
$("#myinput").addClass("redborder");
$("#myinput").removeClass("redborder");
$("#myinput").toggleClass("redborder");
</script>

Answer 2

这对我有用：

document.getElementById('myinput').style.removeProperty('border');