- 表单验证
表单验证
基本信息
表单验证是javascript中的高级选项之一。JavaScript 可用来在数据被送往服务器前对HTML表单中的这些输入数据进行验证。
被 JavaScript 验证的这些典型的表单数据有：
用户是否已填写表单中的必填项目？
用户输入的邮件地址是否合法？
用户是否已输入合法的日期？
用户是否在数据域(numeric field) 中输入了文本？
必填项目
下面的函数用来检查用户是否已填写表单中的必填（或必选）项目。假如必填或必选项为空，那么警告框会弹出，并且函数的返回值为 false，否则函数的返回值则为 true（意味着数据没有问题）：
function validate_required(field, alerttxt)
{ with(field)
{ if (value == null || value == "")
{ alert(alerttxt); return false; }
else { return true; } } }
下面是连同 HTML 表单的代码：
<html> <head> <script type="text/javascript"> function validate_required(field, alerttxt) { with(field) { if (value == null || value == "") { alert(alerttxt); return false; } else { return true; } } } function validate_form(thisform) { with(thisform) { if (validate_required(email, "Email must be filled out!") == false) { email.focus(); return false; } } } </script> </head> <body> <form action="submitpage.htm" onsubmit="return validate_form(this)" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html>
验证
下面的函数检查输入的数据是否符合电子邮件地址的基本语法。
意思就是说，输入的数据必须包含 @ 符号和点号(.)。同时，@ 不可以是邮件地址的首字符，并且 @ 之后需有至少一个点号：
function validate_email(field, alerttxt) { with(field) { apos = value.indexOf("@") dotpos = value.lastIndexOf(".") if (apos < 1 || dotpos - apos < 2) { alert(alerttxt); return false; } else { return true; } } }
function validate_email(field, alerttxt) { with(field) { apos = value.indexOf("@") dotpos = value.lastIndexOf(".") if (apos < 1 || dotpos - apos < 2) { alert(alerttxt); return false; } else { return true; } } }
下面是连同 HTML 表单的完整代码：
<html>
<head>
<script type="text/javascript">
function validate_email(field, alerttxt)
{
with(field) { apos = value.indexOf("@"); dotpos = value.lastIndexOf(".");
if (apos < 1 || dotpos - apos < 2)
{
alert(alerttxt);
return false;
}
else
{
return true;
}
}
}
function validate_form(thisform)
{
with(thisform)
{
if (validate_email(email, "Not a valid e-mail address!") == false)
{
email.focus();
return false
}
}
}
</script>
</head>
<body>
<form action="submitpage.htm" onsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit"> 发送数据
</form>
</body>
</html>
-
长城官方针对拖车钩断裂事件发表声明 进一步开拓海外市场
2025-09-21 04:48:35 查看详情 -
比亚迪新款唐EV将于今日上市 全液晶仪表+可旋转中控屏
2025-09-21 04:48:35 查看详情 -
长安逸动PLUS通过第三方低风阻车型认证 售价11.79万元
2025-09-21 04:48:35 查看详情 -
新款比亚迪汉EV实车图曝光 全液晶仪表+可旋转中控屏
2025-09-21 04:48:35 查看详情 -
-
-
-
-
-
求购