标题表单的客户端验证
栏目网络与通信
作者梁海利
发布2001年44期
在用户填写完表单，并确定向服务器发送之前，我们一般采用客户端浏览器验证填写规范，以减少服务器端脚本执行时间和次数。对于比较简单的表单验证，我们可以用Dreamweaver轻松实现。选中整个表单，用F8或从Window菜单选中behaviors，激活“behaviors-<form>actions”子窗口。单击“+”按钮，在弹出的菜单中选中“validate form”，会弹出一个标题为“validate form”的对话框。在“Named Fields”中选择要验证的文本框名。选中“Value”后的“Required”可以使其为必填项。在“Accept”组中，可以在“Anything”“Number”“Email Address”“Number from”四个按钮中选一个来设定输入的数据类型。设定完后单击“OK”按钮，在Behaviors子窗口就可以看到多了一行内容：“Events”下是“Onsubmit”、“Actions”下是“Validate Form”。若想修改刚才的设定，可在这一行上单击。若查看HTML源码可以看到类似下面这样的一行内容：
<form name="form1" action="confirm.asp"onSubmit="MM_validateForm('textfield'，''，'R'，'textfield2'，''，'NisNum');return document.MM_returnValue" >。
对于需要复杂验证的表单，我们还是只能在HTML中加入JavaScript来实现了。比如有一个用户修改密码的表单。要求用户输入“用户名”(在user_name框中输入)、“原密码”(在old_password框中输入)、“新密码”(在new_password框中输入)、“新密码确认”(在confirm_password框中输入)，要求输入不能包含非法字符“\{}”，不能为空，新密码与确认密码必须一致。
在<HEAD></HEAD>之间加入如下代码：
<SCRIPT language=javascript>
function contain(str，charset)// 字符串包含测试函数
{
var i；
for(i=0;i<charset.length;i++)
if(str.indexOf(charset.charAt(i))>=0)
return true;
return false；
}
function check_input() //输入测试函数
{
with (document.form1){
if ((user_name.value==null)||(user_name.value.length==0))
{
alert("请输入用户名！");
user_name.focus();
return false;
}
if(containuser_name.value， "\\{} "))
{
alert("用户名中含有非法字符\\{}或空格！"！");
user_name.focus()；
return false；
}
if((old_password.value==null)||(old_password.value.length==0))
{
alert("原密码不能为空！")；
old_password.focus()；
return false;
}
if(contain(old_password.value，"\\{} "))
{
alert("原密码中含有非法字符\\{}或空格！")；
old_password.focus();
return false;
}
if((new_password.value==null)||(new_password.value.length==0))
{
alert("新密码不能为空！");
new_password.focus();
return false;
}
if(contain(new_password.value，"\\{} "))
{
alert("新密码中含有非法字符\\{}或空格！")；
new_password.focus();
return false;
}
if(contain(confirm_password.value，"\\{} "))
{
alert("确认密码中含有非法字符\\{}或空格！")；
confirm_password.focus()；
return false;
}
if(new_password.value！=confirm_password.value)
{
alert("新密码与确认密码不一致！");
confirm_password.focus()；
return false;
}
}
return true;
}
</SCRIPT>
用Dreamweaver做好表单，并将定义表单的第一句改为：
<FORM action=chgpwd.asp method=post name=form1
onsubmit="return check_input()">