23

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

例如更改边框： 

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

如何重置？下一行只是完全删除了边框...... 

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

如果我将边框颜色重新设置为特定颜色（例如黑色或灰色等），它在某些浏览器/操作系统中可能看起来很奇怪，这种“主题”控件...

多谢！

4

3 回答 3

29

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

删除 CSS 属性是有问题的，因为您并不总是知道应该将它们设置回什么。添加和删​​除类只是...有效。

每个元素可以有多个类，所以真的没有理由反对这样做（恕我直言）。

我习惯了 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>
于 2009-02-23T01:59:32.117 回答
6

这对我有用：

document.getElementById('myinput').style.removeProperty('border');
于 2013-11-13T22:33:00.953 回答
0

你只是想让边界消失吗？我不这么认为，正如你所说的那样，事实并非如此。

“重置”的正确方法是设置为默认值。我不确定默认值是什么，但我猜想'1px black'或类似的东西。

我通常在各种应用程序中使用这种技术。当我不知道默认值时，我将设置我自己的“默认值”，以便我可以重复它。对于网页，我最喜欢的技术之一是设置控件的背景颜色，而不是边框​​。它非常明显，您可以选择更柔和的颜色并且仍然具有影响力。在这种情况下，很容易将背景设置回白色，这是默认设置。

于 2009-02-23T02:01:36.900 回答