现在很多网站都利用表单页来提高网站的交互性能。大家都知道表单的运作需要后台程序来运行，具体地说就是用CGI或ASP，当用户提交表单后，CGI在处理表单信息前必须判断信息的正确性，当有不正当信息时显示出错页面返还给用户，但这样一来用户端就会繁琐而耗时，因此，我们希望在前台先判断用户输入信息的准确性，保证送入后台的信息都是合法的，减少因为用户的错误输入而产生的时间浪费。下面的一个例子就是在HTML页面里插入了一段JavaScript来完成对表单信息的前台验证。当用户没有输入姓名和E-mail地址或输入的E-mail地址不含“@”和“.”时，将弹出相应的提示并将光标定位于相应的输入框。
<html>
<head><title>数据验证</title></head>
<script language=“JavaScript”>
function ValidateOrder(form)
{
if (form.User_name.value == “”) #检验是否输入了姓名
{alert(“您没有输入姓名！”); form.User_name.focus(); return;}
if (form.User_email.value == “”) #检验是否输入了email地址
{alert(“您没有输入E-mail地址！”); form.User_email.focus(); return;}
if(form.User_email.value.indexOf('@'， 0) == -1 )||#检验输入的email地址是否合法
form.User_email.value.indexOf('.'， 0) == -1)
{alert(“您输入的E-mail地址不对！”);form.User_email.focus();return;}
form.submit()；
}
</script>
<body>
<form method=“post” action=“”>
<p>姓名：
<input type=“text” name=“User_name”>
</p>
<p>E-mail：
<input type=“text” name=“User_email”>
</p>
<p>
<input type=“button” name=“Button” value=“提交” onclick=“ValidateOrder(this.form)”>
</p>
</form>
</body>
</html>