作为一名Web设计人员
一名Coder
你是否已经厌倦了网页设计中的表单验证问
题?不厌其烦的拷贝 if(x) { alert(wrong);} 还是使用一个难以尽和我意的
IDE ?好吧让我来告诉你一种比较lazy的写法你也许就不会对表单验证那么头大
了……
原理
表单验证无非是要对要收集每一条信息进行验证也就是要写一个名为
frmValid的javascript函数在其中执行如下操作
if (待验证条目 不符合条件)
{
alert(出错了!);
待验证条目focus();
return false;
}
// all right
return true;
当然<form onsubmit=return frmValid()>必须包含在
HTML代码中想想看待验证条目越多代码越长也就越容易出错
下面我们把验证条目放到一个数组里如下
elemArray =new Array(
待验证条目名
验证条件
出错提示);
那么验证代码将大大精简我们只要如下使用循环就可实现上述冗长
代码时下的功能这里我们用with和eval语句构造判断条件
with(eval(obj+elems[i][]))
{
if(eval(elems[i][]))
{
windowalert(elems[i][]);
focus();
return false;
}
}
我们建立多位数组就可实现循环遍历每个条目
elems =new Array(
new Arrary( )
);
for(i = ; i < elemslength; i++)
{
// 上面的验证语句
}
实战
使用如下例子编写验证脚本
<SCRIPT LANGUAGE=javascript type=text/javascript>
//
// Function: frmValid
//
// Author hongz
// Usage: YourFormonsubmit=return frmValid(this)
// Purpose: To validate form elements in an integrated way
//
function frmValid(obj)
{
// Elements array initialization for validation
elems = new Array(
new Array(
username// name of elements to be validated
valuelength< || valuesearch(/[^azAz_]/)>=
// validation condition
无效的用户名:只能输入位字母数字下划线的组合!)
// prompt on failure
new Array(
password
valuelength< || valuesearch(/[^azAz_]/)>=
无效的密码:只能输入位字母数字下划线的组合!)
new Array(
email
isMail(value)==false
Email是您在网上的重要联络工具请务必正确填写!)
);
// Validate here using eval statement
for(i = ; i < elemslength; i++)
{
with(eval(obj+elems[i][]))
{
if(eval(elems[i][]))
{
windowalert(elems[i][]);
focus();
return false;
}
}
}
return true;
}
//>
</SCRIPT>
为form添加onsubmit属性
<form onsubmit=return frmValid(this)>
如果你感觉我的方法还行的话那我欢迎你使用呵呵……