Javascript验证代码

在Web应用开发中，对于页面的表单输入，常常要求合法性检查，比如检查输入是否是整数，是否是有效的邮件地址等等。通常的做法是对要验证的输入域写独立的处理函数进行检查，这无形中增加了工作量，并且代码不重用。下面介绍用正则表达式来实现输入域验证，无需在HTML页面中书写Javascript代码，需要的是在要验证的输入域中定义验证模式就可以了。实现统一验证的 Javascript代码如下：

Javascript验证代码// 使用举例
/**
* 统一验证方法
* Form 元素中输入相关标记
* vmode: ['not null']
* vdisp: 显示信息
* vtype: 校验类型 ['none','string','tabledefine','integer','datetime','date','time','postcode','float','email','phone','mobiletel','ip']
* 例子： <input type="text" name="IPAddress" vmode="not null" vdisp="输入的IP地址" vtype="ip" >
*/

// 正则表达式定义

var validrule = new Object();
validrule.string = /^([^'<>]+)?$/;
validrule.tabledefine = /^([A-Za-z][A-Za-z0-9|_]{1,18})?$/;
validrule.integer = /^(\d*)$/;
validrule.date = /^((([1-9]\d{3})|([1-9]\d{1}))-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]))?$/;
validrule.time = /^((0[1-9]|1[0-9]|2[0-4]):([0-5][0-9]):([0-5][0-9]))?$/;
validrule.datetime = /^((([1-9]\d{3})|([1-9]\d{1}))-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]) (0[1-9]|1[0-9]|2[0-4]):([0-5][0-9]):([0-5][0-9]))?$/;
validrule.postcode = /^(\d{6})?$/;
validrule.float = /^(([0-9]\d?)($|(\.\d+$)))?$/;
validrule.email = /^(.+\@.+\..+)?$/;
validrule.phone = /^(\(\d{3}\))?(\(?(\d{3}|\d{4}|\d{5})\)?(-?)(\d+))?((-?)(\d+))?$/;
validrule.mobiletel = /^(13(\d{9}))?$/;
validrule.ip = /^(([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5]))?$/;



function doValidate( vform )
{
var elems = vform.elements;
var frmLen = elems.length;
var thePat = "";
var strFormatInfo = "";
//对于每一个FROM元素
for(var i=0;i<frmLen;i++)
{
var _elem = elems[i];
//为空检查
if(_elem.vmode != null && _elem.vmode == "not null")
{
if(_elem.value.length == 0)
{
alert(_elem.vdisp+"不能为空!")
_elem.focus();
return false;
}
}
//类型检查
if(_elem.vtype == null)
{
continue;
}
if(_elem.vtype=="none")
{
thePat = "";
strFormatInfo = "";
}
if(_elem.vtype=="string")
{
thePat = validrule.string;
strFormatInfo = "asd";
}

if(_elem.vtype=="tabledefine")
{
thePat = validrule.tabledefine;
strFormatInfo = "p_tablename";
}
if(_elem.vtype=="integer")
{
thePat = validrule.integer;
strFormatInfo = "123456";
}
if(_elem.vtype=="datetime")
{
thePat = validrule.datetime;
strFormatInfo = "2004-08-12 08:37:29";
}
if(_elem.vtype=="date")
{
thePat = validrule.date;
strFormatInfo = "2004-08-12";
}
if(_elem.vtype=="time")
{
thePat = validrule.time;
strFormatInfo = "08:37:29";
}
if(_elem.vtype=="postcode")
{
thePat = validrule.postcode;
strFormatInfo = "100001";
}
if(_elem.vtype=="float")
{
thePat = validrule.float;
strFormatInfo = "356.32";
}
if(_elem.vtype=="email")
{
thePat = validrule.email;
strFormatInfo = "[e-mail]";
}
if(_elem.vtype=="phone")
{
thePat = validrule.phone;
strFormatInfo = "010-67891234";
}
if(_elem.vtype=="mobiletel")
{
thePat = validrule.mobiletel;
strFormatInfo = "13867891234";
}

if(_elem.vtype=="ip")
{
thePat = validrule.ip;
strFormatInfo = "172.22.169.11";
}

var gotIt = null;
if(thePat!="")
{
gotIt = thePat.exec(_elem.value);
}
if(gotIt == null)
{
alert(_elem.vdisp+"输入不合法,格式应为："+strFormatInfo);
_elem.focus();
return false;
}
}
return true;
}
表单中这么使用：表单使用举例代码 <table class='table1' cellspacing=1 cellpadding=1 width="95%" align=center border=0>
<tbody>
<form name='form1' method='post' action='xxx.jsp' target='_self' onsubmit='return doValidate(form1)'>
<input name='_tablename' type='hidden' value='p_example'>
<tr>
<td width='50%'>用户编号<input type='text' name='UserID' class='text1' size='30' maxlength='23' vmode='not null' vdisp='用户编号' vtype='string'></td>
<td width='50%'>用户名称<input type='text' name='UserName' class='text1' size='30' maxlength='20' vmode='not null' vdisp='用户名称' vtype='string'></td>
</tr>
<tr>
<td width='50%'>用户性别<select name='Sex' class='select1' size='1' maxlength='10' vmode='' vdisp='用户性别' vtype='string'>
<option value='male'>男</option>
<option value='female'>女</option>
</select></td>
<td width='50%'>出生日期<input type='text' name='Birthday' class='text1' size='30' maxlength='10' vmode='not null' vdisp='出生日期' vtype='date' ></td>
</tr>
<tr>
<td width='50%'>固定电话<input type='text' name='Phone' class='text1' size='0' maxlength='20' vmode='' vdisp='固定电话' vtype='phone'></td>
<td width='50%'>邮件地址<input type='text' name='Email' class='text1' size='30' maxlength='250' vmode='not null' vdisp='邮件地址' vtype='email'></td>
</tr>
<tr>
<td width='50%'>机器地址<input type='text' name='IPAddress' class='text1' size='30' maxlength='20' vmode='not null' vdisp='机器地址' vtype='ip'></td>
<td width='50%'></td>
</tr>
<tr>
<td width='50%'>入职日期<input type='text' name='DateTime' class='text1' size='30' maxlength='10' vmode='not null' vdisp='入职日期' vtype='date' ></td>
<td width='50%'></td>
</tr>
</form>
</tbody>
</table>
　// 正则表达式定义 var validrule = new Object(); validrule.string = /^([^'<>]+)?$/; validrule.tabledefine = /^([A-Za-z][A-Za-z0-9|_]{1,18})?$/; validrule.integer = /^(\d*)$/; validrule.date = /^((([1-9]\d{3})|([1-9]\d{1}))-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]))?$/; validrule.time = /^((0[1-9]|1[0-9]|2[0-4]):([0-5][0-9]):([0-5][0-9]))?$/; validrule.datetime = /^((([1-9]\d{3})|([1-9]\d{1}))-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]) (0[1-9]|1[0-9]|2[0-4]):([0-5][0-9]):([0-5][0-9]))?$/; validrule.postcode = /^(\d{6})?$/; validrule.float = /^(([0-9]\d?)($|(\.\d+$)))?$/; validrule.email = /^(.+\@.+\..+)?$/; validrule.phone = /^(\(\d{3}\))?(\(?(\d{3}|\d{4}|\d{5})\)?(-?)(\d+))?((-?)(\d+))?$/; validrule.mobiletel = /^(13(\d{9}))?$/; validrule.ip = /^(([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5])\.([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-5][0-5]))?$/; function doValidate( vform ) { var elems = vform.elements; var frmLen = elems.length; var thePat = ""; var strFormatInfo = ""; //对于每一个FROM元素 for(var i=0;i