Linux中国 Linux中国门户站!
设为主页 设为主页
收藏本站 收藏本站
 
当前位置 :首页 ->网站设计 ->JavaScript ->正文

用正则表达式和javascript对表单进行全面验证

来源:Linuxdby.com 作者:Webmaster 时间:2007-04-13 点击: [收藏] [投稿]

代码:<!--
使用时请把下面的javascript代码存到一个单一的js文件中。
1、表单要求
 <form name="formname" onSubmit="return validateForm(this)"></form>
 把对表单中的所有以下类型的域依次验证,所有验证是去除了前导和后缀空格的,要注意是区分大小写的。
2、空值验证
 表单中任意域加上emptyInfo属性把对此域是否为空进行验证(可以和最大长度验证\一般验证方式同时使用)。
 无此属性视为此域允许空值。
  如:<input type="text" name="fieldNamename" emptyInfo="字段不能为空!">
3、最大长度验证(可以和空值验证、一般验证方式同时使用):
 <input type="text" name="fieldNamename" maxlength="20" lengthInfo="最大长度不能超过20!">
 或,<textarea maxlength="2000" lengthInfo="最大长度不能超过2000!">
3、一般验证方式(不对空值做验证):
  如:<input type="text" validator="^(19|20)[0-9]{2}$" errorInfo="不正确的年份!" >
4、标准验证(不与其它验证方式同时使用):
 全部通过<input type="hidden">来实现,并且不需要name属性以免提交到服务器。
  4.1、合法日期验证:
  <input type="text" name="yearfieldName" value="2004">注:这里也可以是<select name="yearfieldName"></select>,以下同
  <input type="text" name="monthfieldName" value="02">
  <input type="text" name="dayfieldName" value="03">
  <input type="hidden" validatorType="DateGroup" year="yearfieldName" month="monthfieldName" day="dayfieldName" errorInfo="不正确的日期!">
  yearfieldName、monthfieldName、dayfieldName分别为年月日字段,月和日可以是两位(MM)或一位格式(M),
  此处不对每个字段分别检验(如果要检验,请在年月日三个域分别使用前面的一般验证方式),只对日期的最大值是否合法检查;
 4.2、日期格式验证(请注意,此验证不对日期是否有效进行验证,还未找到从格式中得到年月日数据的方法^_^):
  <input type="text" name="datefieldName" value="2003-01-03 21:31:00">
  <input type="hidden" validatorType="Date" fieldName="datefieldName"; format="yyyy-MM-dd HH:mm:ss" errorInfo="不正确的日期!">
  其中格式仅对y、M、d、H、m、s进行支持(其它字符视为非时间的字符)
 4.3、列表验证:
  检验列表(checkbox、redio、select)是否至少选中了一条记录(对select主要用于多项选择)
  <input type="checkbox" name="checkbox1">
  <input type="hidden" validatorType="Checkbox" fieldName="checkbox1" errorInfo="请至少选中一条记录!">
  其中validatorType可以是Checkbox、R、Select;
  对于一个select表单,如果要求选择一条不能是第一条的记录,请用下列方式:
  <select name="select1" emptyInfo="请选择一个选项!">
  <option value="">==请选择==</option>
  <option value="1">1</option>
  <select>
 4.4、Email验证:
  <input type="text" name="email">
  <input type="hidden" fieldName="email" validatorType="Email" separator="," errorInfo="不正确的Email!">
  其中separator为可选项,表示输入多个email时的分隔符(无此选项只能是一个地址)
 4.5、加入其它javascript操作:
 <script type="text/javascript">
  function functionname(){
    自定义方法
  }
 </script>
 表单中加入<input type="hidden" validatorType="javascript" functionName="functionname">(此时emptyInfo等属性无效)
  时把调用function属性中指定的javascript方法(要求方法返回true或false,返回false把不再验证表单,也不提交表单)。
5、在表单通过验证提交前disable一个按钮(也可把其它域disable,不能与其它验证同在一个域),不要求按钮是表单中的最后一个
 <input type="button" name="提交" validatorType="disable">
6、不验证表单
  <input type="hidden" name="validate" value="0" functionName="functionname">
 当validator域值为0时不对表单进行验证,直接提交表单或执行指定function并返回true后提交表单
 functionName为可选

-->
<script type="text/javascript">
function getStringLength(str){
  var endvalue=0;
  var sourcestr=new String(str);
  var tempstr;
  for (var strposition = 0; strposition < sourcestr.length; strposition ++) {
    tempstr=sourcestr.charAt(strposition);
    if (tempstr.charCodeAt(0)>255 || tempstr.charCodeAt(0)<0) {
      endvalue=endvalue+2;
    } else {
      endvalue=endvalue+1;
    }
  }
  return(endvalue);
}
function trim(str){
  if(str==null) return "";
  if(str.length==0) return "";
  var i=0,j=str.length-1,c;
  for(;i<str.length;i++){
    c=str.charAt(i);
    if(c!=' ') break;
  }
  for(;j>-1;j--){
    c=str.charAt(j);
    if(c!=' ') break;
  }
  if(i>j) return "";
  return str.substring(i,j+1);
}
function validateDate(date,format,alt){

 如果您对本文有任何疑问或者建议,请到讨论区发表您的意见: >> 论坛入口 <<



上一篇: 禁止页面缓存的方法   下一篇: DHTML的简单示例,动态改变页面

文章评论】 【收藏本文】 【推荐好友】 【打印本文】 【我要投稿】 【论坛讨论
更多相关文章
Power by linux-cn.com 粤ICP备05006655号