我已经验证了电子邮件文本框。当它第一次聚焦时，文本框边框的边框将为绿色。如果我们输入无效的邮件 ID，它会提醒用户输入正确的邮件 ID。现在光标将聚焦文本框，这次我希望文本框边框应该是红色的，边框宽度应该是 3px。一旦输入正确的有效 ID，边框就会消失。
这是我的代码
<html>
<head>
<title>untitled</title>
<script type="text/javascript" language="javascript">
function Validate() {
var str=document.forms["register"]["requiredEMAIL"].value;
var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
if (!filter.test(str))
{
alert("Please input a valid email address!");
document.forms["register"]["requiredEMAIL"].focus();
return false;
}
}
</script>
<style>
#mail{
font-size:14px;
min-width:250px;
border-width:2px;
border-color:#cccccc;
border-style:solid;
padding:5px;
border-radius:5px;
box-shadow: 1px 0px 13px 0px rgba(42,42,42,.24); }
#mail:focus{border-color:#63C6AE; border-width:3px; }
</style>
</head>
<body>
<form method="post" action="abcd.abc.abc" onSubmit="return Validate(this)" name="register">
<input type="email" name="requiredEMAIL" id="mail" >
<input type="submit">
</form>
</body>
</html>
最佳答案
添加和删除 css 类，
<script type="text/javascript">
$("#addClass").click(function () {
$('#para1').addClass('highlight');
});
$("#removeClass").click(function () {
$('#para1').removeClass('highlight');
});
</script>
关于javascript - 如何在javascript函数中添加和删除css类，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31130425/