本文详细介绍JavaScript中两种常见的表单验证方法：检查必填项是否为空，以及验证E-mail地址的基本语法格式。通过具体的JavaScript函数示例，展示如何利用indexOf和lastIndexOf判断@符号与点号的位置，确保用户输入符合基本规范。
JavaScript表单验证概述与必填项检查
本文分享了使用JavaScript进行表单验证的典型案例，主要涵盖以下数据检查场景：用户是否填写了表单中的必填项目；输入的邮件地址是否符合基本合法性要求；输入的数据域是否为合法的日期格式；以及在数值字段中是否错误地输入了文本。针对必填项目（或必选项）的检查，本文提供了一个JavaScript函数。该函数用于判断用户是否已填写必填项。若必填或必选项为空，函数将弹出警告框并返回false；若填写正确，则返回true，表示数据无误。
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}以下是包含HTML表单结构的完整代码示例：
必填项验证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>
E-mail地址格式验证逻辑
接下来介绍E-mail地址的验证逻辑。该函数用于检查用户输入的数据是否符合电子邮件地址的基本语法规范。具体要求包括：输入内容必须包含“@”符号和点号“.”；“@”符号不能作为邮件地址的首字符；且在“@”符号之后，必须至少包含一个点号。
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表单示例
<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>
以上内容为本文的全部介绍，希望能为读者学习JavaScript表单验证提供帮助。