码迷,mamicode.com
首页 > Web开发 > 详细

12个常用的JS表单验证

时间:2019-03-10 11:14:06      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:lse   表单   UNC   put   验证   date()   i++   date   汉字   

  • 长度限制
  • <form name="a" onsubmit="return test()"> 
    <textarea name="b" cols="40" rows="6" placeholder="不能超过50个字符!"></textarea>
    <br /> 
    <input type="submit" name="Submit" value="check"> 
    </form>
    
    <script language="javascript"> 
    function test() 
    { 
        if(document.a.b.value.length>50) { 
            alert("不能超过50个字符!"); 
            document.a.b.focus(); 
            return false; 
        }
    } 
    </script>
    1. 只能是汉字
      <input type="text" onblur="isChinese(this.value)" placeholder="请输入中文!" />
      <script language="javascript"> 
      function isChinese(obj){ 
          var reg=/^[\u0391-\uFFE5]+$/; 
          if(obj!=""&&!reg.test(obj)){ 
          alert(‘必须输入中文!‘);
          return false; 
      } 
      }
      </script>
    2. 只能是英文字母
      <script type="text/javascript">
      function checkZm(zm){ 
      var zmReg=/^[a-zA-Z]*$/; 
      if(zm!=""&&!zmReg.test(zm)){ 
          alert("只能是英文字母!");
          return false; 
      } 
      } 
      </script>
    3. 只能是数字

      <script language=javascript> 
      function checkNumber(obj){ 
      var reg = /^[0-9]+$/; 
      if(obj!=""&&!reg.test(obj)){ 
          alert(‘只能输入数字!‘); 
          return false; 
      } 
      } 
      </script>
    4. 只能是英文字母和数字
      <script type="text/javascript">
      function checkZmOrNum(zmnum){ 
          var zmnumReg=/^[0-9a-zA-Z]*$/; 
          if(zmnum!=""&&!zmnumReg.test(zmnum)){ 
              alert("只能输入是字母或者数字,请重新输入");
              return false; 
          } 
      } 
      </script>
    5. 检验时间大小(与当前时间比较)
      <script type="text/javascript">
      function checkDate(obj){ 
      var obj_value=obj.replace(/-/g,"/");//替换字符,变成标准格式(检验格式为:‘2009-12-10‘) 
      //var obj_value=obj.replace("-","/");//替换字符,变成标准格式(检验格式为:‘2010-12-10 11:12‘) 
      var date1=new Date(Date.parse(obj_value)); 
      var date2=new Date();//取今天的日期 
      if(date1>date2){ 
      alert("不能大于当前时间!"); 
      return false; 
      } 
      } 
      </script>
    6. 屏蔽关键字(这里屏蔽*和**)

      <script type="text/javascript">
      function test(obj) { 
          if((obj.indexOf ("***") == 0) || (obj.indexOf ("****") == 0)){ 
              alert("屏蔽关键字(这里屏蔽***和****)!");
              return false;} 
      } 
      </script>
    7. 两次输入密码是否相同
      <script type="text/javascript">
      function check(){ 
      with(document.all){ 
          if(input1.value!=input2.value){ 
              alert("密码不一致") 
              input1.value = ""; 
              input2.value = ""; 
          } 
          else {
              alert("密码一致");
              document.forms[0].submit(); 
          }
      }
      } 
      </script>
    8. 表单项不能为空
      <script language="javascript"> 
      function CheckForm(obj) { 
      if (obj.length == 0) { 
      alert("姓名不能为空!"); 
      return false; 
      } 
      return true; 
      alert("姓名不能为空!"); 
      } 
      </script>
    9. 邮箱验证
      <script language="javascript">
      function test(obj){
          var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
      if(!myreg.test(obj)){
          alert(‘请输入有效的邮箱!‘);
          return false;
      }
      }
      </script>
    10. 验证手机号
      <script type="text/javascript">
      function validatemobile(mobile){ 
          if(mobile.length==0){ 
              alert(‘手机号码不能为空!‘);
              return false; 
          } 
          if(mobile.length!=11){ 
              alert(‘请输入有效的手机号码,需是11位!‘);
              return false; 
          } 
          var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/; 
          if(!myreg.test(mobile)) { 
              alert(‘请输入有效的手机号码!‘); 
              return false; 
          } 
      } 
      </script>
    11. 验证×××号码(需是有效×××)
    <script type="text/javascript">
    // 构造函数,变量为15位或者18位的×××号码
    function clsIDCard(CardNo) {
    this.Valid=false;
    this.ID15=‘‘;
    this.ID18=‘‘;
    this.Local=‘‘;
    if(CardNo!=null)this.SetCardNo(CardNo);
    }
    
    // 设置×××号码,15位或者18位
    clsIDCard.prototype.SetCardNo = function(CardNo) {
    this.ID15=‘‘;
    this.ID18=‘‘;
    this.Local=‘‘;
    CardNo=CardNo.replace(" ","");
    var strCardNo;
    if(CardNo.length==18) {
    pattern= /^\d{17}(\d|x|X)$/;
    if (pattern.exec(CardNo)==null)return;
    strCardNo=CardNo.toUpperCase();
    } else {
    pattern= /^\d{15}$/;
    if (pattern.exec(CardNo)==null)return;
    strCardNo=CardNo.substr(0,6)+‘19‘+CardNo.substr(6,9)
    strCardNo+=this.GetVCode(strCardNo);
    }
    this.Valid=this.CheckValid(strCardNo);
    }
    
    // 校验×××有效性
    clsIDCard.prototype.IsValid = function() {
    return this.Valid;
    }
    
    // 返回生日字符串,格式如下,1981-10-10
    clsIDCard.prototype.GetBirthDate = function() {
    var BirthDate=‘‘;
    if(this.Valid)BirthDate=this.GetBirthYear()+‘-‘+this.GetBirthMonth()+‘-‘+this.GetBirthDay();
    return BirthDate;
    }
    
    // 返回生日中的年,格式如下,1981
    clsIDCard.prototype.GetBirthYear = function() {
    var BirthYear=‘‘;
    if(this.Valid)BirthYear=this.ID18.substr(6,4);
    return BirthYear;
    }
    
    // 返回生日中的月,格式如下,10
    clsIDCard.prototype.GetBirthMonth = function() {
    var BirthMonth=‘‘;
    if(this.Valid)BirthMonth=this.ID18.substr(10,2);
    if(BirthMonth.charAt(0)==‘0‘)BirthMonth=BirthMonth.charAt(1);
    return BirthMonth;
    }
    
    // 返回生日中的日,格式如下,10
    clsIDCard.prototype.GetBirthDay = function() {
    var BirthDay=‘‘;
    if(this.Valid)BirthDay=this.ID18.substr(12,2);
    return BirthDay;
    }
    
    // 返回性别,1:男,0:女
    clsIDCard.prototype.GetSex = function() {
    var Sex=‘‘;
    if(this.Valid)Sex=this.ID18.charAt(16)%2;
    return Sex;
    }
    
    // 返回15位×××号码
    clsIDCard.prototype.Get15 = function() {
    var ID15=‘‘;
    if(this.Valid)ID15=this.ID15;
    return ID15;
    }
    
    // 返回18位×××号码
    clsIDCard.prototype.Get18 = function() {
    var ID18=‘‘;
    if(this.Valid)ID18=this.ID18;
    return ID18;
    }
    
    // 返回所在省,例如:上海市、浙江省
    clsIDCard.prototype.GetLocal = function() {
    var Local=‘‘;
    if(this.Valid)Local=this.Local;
    return Local;
    }
    
    clsIDCard.prototype.GetVCode = function(CardNo17) {
    var Wi = new Array(7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2,1);
    var Ai = new Array(‘1‘,‘0‘,‘X‘,‘9‘,‘8‘,‘7‘,‘6‘,‘5‘,‘4‘,‘3‘,‘2‘);
    var cardNoSum = 0;
    for (var i=0; i<CardNo17.length; i++)cardNoSum+=CardNo17.charAt(i)*Wi[i];
    var seq = cardNoSum%11;
    return Ai[seq];
    }
    
    clsIDCard.prototype.CheckValid = function(CardNo18) {
    if(this.GetVCode(CardNo18.substr(0,17))!=CardNo18.charAt(17))return false;
    if(!this.IsDate(CardNo18.substr(6,8)))return false;
    var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江 ",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北 ",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏 ",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"};
    if(aCity[parseInt(CardNo18.substr(0,2))]==null)return false;
    this.ID18=CardNo18;
    this.ID15=CardNo18.substr(0,6)+CardNo18.substr(8,9);
    this.Local=aCity[parseInt(CardNo18.substr(0,2))];
    return true;
    }
    
    clsIDCard.prototype.IsDate = function(strDate) {
    var r = strDate.match(/^(\d{1,4})(\d{1,2})(\d{1,2})$/);
    if(r==null)return false;
    var d= new Date(r[1], r[2]-1, r[3]);
    return (d.getFullYear()==r[1]&&(d.getMonth()+1)==r[2]&&d.getDate()==r[3]);
    }
    
    function valiIdCard(idCard){
    var checkFlag = new clsIDCard(idCard);
    if (!checkFlag.IsValid()) {
    alert("输入的×××号无效,请输入真实的×××号!");
    document.getElementByIdx("idCard").focus();
    return false;
    }else{
    alert("是有效×××!");
    }
    }
    </script>

    12个常用的JS表单验证

    标签:lse   表单   UNC   put   验证   date()   i++   date   汉字   

    原文地址:https://blog.51cto.com/9161018/2360675

    (0)
    (0)
       
    举报
    评论 一句话评论(0
    登录后才能评论!
    © 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
    迷上了代码!