`

通用的js校验,等待扩展

阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>登录与注册</title>
<script type="text/javascript">
var check={
   /**/
   /*定义提示信息*/
   e1:"两次输入的密码不一致",
   e2:"-请填写此项",
   e3:"-请正确填写此项",
   e4:"-输入长度不能小于",
   e5:"-输入长度不能超过",
   /*定义验证正则表达*/
   Email    : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
   Phone    : /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/,
   Mobile   : /^((\(\d{2,3}\))|(\d{3}\-))?13\d{9}$/,
   Url      : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
   Currency : /^\d+(\.\d+)?$/,
   Number   : /^\d+$/,
   Zip      : /^[1-9]\d{5}$/,
   QQ       : /^[1-9]\d{4,8}$/,
   Integer : /^[-\+]?\d+$/,
   Double   : /^[-\+]?\d+(\.\d+)?$/,
   English : /^[A-Za-z]+$/,
   Chinese : /^[\u0391-\uFFE5]+$/,
   Username : /^[a-z]\w{3,}$/i,
   UnSafe   : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,
   /*获取表单对象*/
   $:function(id){return document.getElementById(id);},
   /*获取表单值*/
   $v:function(id){return (this.$(id)? this.$(id).value:null);},
   toL:function(str){return str.toLowerCase();}, //字符串转换成小写
   toU:function(str){return str.toUpperCase();}, //字符串转换成大写
   /*检查两次输入的密码是否相同,不同的话返回提示信息*/
   pwd:function(id1,id2){with(this){if($v(id1)!=$v(id2)){$(id2).value='';return e1;}return ''}},
   /*用正则表达式验证表单值是否符合,如f='REmail4-10'表示必须填写格式为Email的长度4-10的字符串*/
   reg:function (id,f){
       var val=this.$(id);if(val){val=val.value}else{return 'arguments error'};
       /*以下判断表单是否必须填写,如果是表单为空时返回错误*/
    if(f.indexOf('R')==0){f=f.substring(1);if(!val)return this.e2;}
       /*当表单值不为空时判断值的类型是否符合*/
    if(val){      
        var t=/([A-Za-z]*)(\d*)\-*(\d*)/; //取出判断判断字符串中的规则名称,最小长度,最大长度
     if(t.test(f)){
       t.exec(f);r1=RegExp.$1;r2=RegExp.$2;r3=RegExp.$3;
       if(r1){if(this[r1])if(!this[r1].test(val))return this.e3;}//判断类型
          if(r2 && val.length<r2){return this.e4+r2;} //判断长度是否小于设定
    if(r3 && val.length>r3){return this.e5+r3;} //判断长度是否超过设定
     }
       }
    return '';
   },
   /*根据参数类型调用判断函数,返回提示信息*/
   error:function(id,id2){with(this){return ((toL(id)!=toL(id2) && $(id2))?pwd(id,id2):reg(id,id2));}},
   errors:function(){
      var args=arguments,e,ers='';
   for(i=0;i<(args.length-1);i+=2){e=this.error(args[i],args[i+1]);if(e)ers+=e;}
   return ers; //返回多条出错信息
   },
   /*弹出提示信息*/
   alt:function(){
      var args=arguments,e,ers='';
   for(i=0;i<(args.length-2);i+=3){e=this.error(args[i],args[i+1]);if(e)ers+=args[i+2]+e+"\n";}
   if(ers){ers="以下填写有误:\n"+ers;alert(ers);}
   return (ers =='');
   },
   /*将一条提示信息显示到span*/
   info:function(id,id2,span){
   with(this){if($(span)){ers=error(id,id2);$(span).innerHTML=ers;return (ers=='');}return false;}
   },
   /*将多条信息显示到span里面如check.infos('spanid','id1','reg1','info1','id2','reg2','info2')*/
   infos:function(span){
      with(this){    
        if($(span)){
    var args=arguments,e,ers='';
    for(i=1;i<(args.length-2);i+=3){e=this.error(args[i],args[i+1]);if(e)ers+=args[i+2]+e+"\n";}
    $(span).innerHTML=ers; return (ers =='');
   }return false;
   }
   }
}
</script>
</head>

<body>
<div>
<form action="" method="post" onsubmit="return check.infos('errors','name','RUsername','姓名','eml','REmail','电子邮箱');">
<div id="errors"></div>
<label>注册名称
<input name="name" maxlength="15" type="text"/><span id="forname"></span></label><br />
<label>登录密码
<input name="pwd1" type="text" onblur="return"/></label><br />
<label>重复密码
<input name="pwd2" type="text" onblur="check.info('pwd1','pwd2','pp')"/>
<span id="pp"></span></label><br />
<label>电子邮箱
<input name="eml" type="text" onblur=""/></label><br />
<input name="actions" type="submit" />
</form>
</div>

</body>
</html>

分享到:
评论

相关推荐

    Framework.Validate通用实体校验组件

    6. **扩展性**:随着项目需求的变化,组件应该能够方便地扩展,支持更多的校验规则和场景。 7. **与现有框架集成**:"Framework.Validate"可能已经考虑了与其他流行框架(如ASP.NET MVC、Entity Framework等)的...

    通用JS表单验证

    使用时请将下面的javascript代码存到一个单一的js文件中。 1、表单要求 (this)"&gt; 将对表单中的所有以下类型的域依次验证,所有验证是去除了前导和后缀空格的,要注意是区分大小写的。 2、空值验证 表单中任意域...

    Js 通用验证代码,实用的。

    总的来说,这个通用JavaScript验证代码库是一个强大的工具,可以帮助开发者轻松地处理各种前端验证需求,减少代码重复,提高代码质量,同时也有利于项目的维护和扩展。通过学习和使用这样的库,开发者可以更高效地...

    javascript常用校验脚本

    这些验证脚本是JavaScript中进行数据校验的基本工具,它们可以根据实际需求进行组合和扩展,以满足更复杂的应用场景。例如,你可以结合这些函数创建一个自定义的表单验证器,对用户输入进行全方位的检查。同时,随着...

    Mtils是一套前端代码集合提供常用的数据校验数据加密扩展函数便捷函数

    Mtils 的扩展函数部分是对 JavaScript 原生对象功能的补充和增强,比如对 Array、String、Date 等对象的扩展。这些扩展函数通常是为了提升代码的可读性和可维护性,减少重复代码,例如数组的去重、字符串的操作等。...

    Struts2的输入校验

    2. 客户端校验:Struts2支持在客户端进行输入校验,通常通过JavaScript实现,可以在表单提交前就捕获错误,提高用户体验。 3. 服务器端校验:当请求到达服务器时,Struts2会尝试调用`validateXxx()`方法,其中`Xxx`...

    js实现时间日期校验

    总结来说,JavaScript提供了多种方式来校验时间日期,包括但不限于使用原生JavaScript Date对象进行比较,以及利用第三方库如jQuery和laydate提供的扩展功能。理解并熟练运用这些方法,可以帮助开发者构建更加健壮、...

    通用表单验证Jquery插件.rar

    通常,Jquery插件会包含JavaScript文件(.js)、CSS样式文件(.css)以及可能的图片资源,用于实现其功能和界面效果。开发者需要将这些文件引入到他们的HTML页面中,才能使插件正常工作。 使用Jquery进行表单验证的...

    js原型通用验证框架

    JavaScript原型通用验证框架是一种基于JavaScript设计模式的高效验证工具,其核心原理是利用JavaScript的原型(prototype)特性来实现对象的扩展与复用,从而达到代码的模块化和可维护性。这一框架广泛应用于Web开发...

    精心整理的几个ASP.NET通用类

    在这个精心整理的压缩包中,包含了四个核心的ASP.NET通用类,分别用于数据库操作、字符串操作、文件操作以及JavaScript操作。这些类为开发者提供了方便快捷的工具,使得在ASP.NET项目中的常见任务能够更加高效地执行...

    js验证表单 js验证表单

    js表单验证控制代码大全 ...2.8:form文本域的通用校验函数 */ 1. 长度限制 function test() { if(document.a.b.value.length&gt;50) { alert("不能超过50个字符!"); document.a.b.focus(); return false; } } ()"&gt; ...

    基于 .NET 6/8 (Furion/SqlSugar) 实现的通用权限开发框架,前端采用 Vue3/Element-plus

    集成多租户、缓存、数据校验、鉴权、事件总线、动态API、通讯、远程请求、任务调度、打印等众多黑科技基于 .NET 6/8 (Furion/SqlSugar) 实现的通用权限开发框架,前端采用 Vue3/Element-plus,代码简洁、易扩展。...

    JavaScript中通用的两个非空检测函数

    ### JavaScript中通用的两个非空检测函数 在前端开发领域,特别是使用JavaScript进行表单验证时,非空检测是非常常见的需求之一。对于新手而言,掌握几种简单有效的非空检测方法非常有帮助。本文将详细介绍两种常用...

    我佛山人Validator3.0

    这可以通过扩展或覆盖默认的验证函数来实现。 3. **错误提示**:当验证失败时,Validator3.0会生成易于理解的错误消息,并将这些消息显示给用户,帮助他们了解如何修正输入。 4. **异步验证**:对于需要服务器验证...

    easyui mvc通用权限

    EasyUI是一个轻量级的JavaScript库,它基于jQuery,提供了丰富的UI组件,如表格、对话框、菜单、表单等,使得开发者能够快速构建用户友好的界面。EasyUI的组件样式统一,易于定制,同时对响应式布局有良好的支持,...

    validate 通用Ajax无刷新表单验证类

    这个"validate 通用Ajax无刷新表单验证类"可能是对validate库的一个扩展或增强,增加了Ajax无刷新的功能。通过结合Ajax技术,验证过程可以在后台进行,当用户提交表单时,验证结果会通过Ajax请求返回,然后前端根据...

    jQuery带Tips动画提示通用表单验证插件下载(jquery validate),动画效果漂亮

    《jQuery带Tips动画提示通用表单验证插件详解》 在网页开发中,表单验证是必不可少的一个环节,它能够确保用户输入的数据符合预设的规则,提高用户体验并减少服务器端的压力。jQuery Validate插件正是这样一个强大...

    基于Vue表单通用验证插件

    Vue.js 是一个流行的轻量级前端JavaScript框架,用于构建用户界面。在开发Web应用程序时,表单验证是不可或缺的一部分,确保用户输入的数据符合预设的规则。基于Vue的表单通用验证插件是为了简化这一过程而设计的。...

    js插件.rar

    本压缩包“js插件.rar”提供了一些通用的JS插件,适用于各种网页开发场景。 1. **表单验证** 表单验证是网页前端开发中的重要环节,确保用户输入的数据符合预设格式和要求。这些JS插件可能包含了手机号、邮箱、...

Global site tag (gtag.js) - Google Analytics