JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】


Posted in Javascript onFebruary 14, 2017

本文实例总结了JS表单验证方法。分享给大家供大家参考,具体如下:

回回写表单,回回要写不同的检查JS,很麻烦,后来写了通用的检查函数,很粗糙,但比较实用,以后再好好改改:

包含页: Check-Form.js

代码如下:

//规则检查排序
function RegCheck(objs)
{
 var str = objs.checktype;
 switch (str)
  {
    case "cn" :  //要检查的表单控件的输入类型必须为中文
     return CnWordRegCheck(objs);
     break;
    case "idnum" :
     return IdCardRegCheck(objs); //要检查的表单控件的输入类型必须为身份证号
     break;
  case "num" :  //要检查的表单控件的输入类型必须为数字
      return NumRegCheck(objs);
   break;
  case "mail" :  //要检查的表单控件的输入类型必须为EMAIL
     return EmailRegCheck(objs);
     break;
  case "txt" :  //要检查的表单控件的输入类型必须为字符串
   return SpecialWordRegCheck(objs);
   break;
  case "notes" :
   return true; //要检查的表单控件的输入类型必须为什么都可以
   break;
  }
}
//************************************************
//检查电话号码
function NumRegCheck(obj)
{
 var uplimit = obj.checkrule.split(",")[0];
 var downlimit = obj.checkrule.split(",")[1];
 var reg = "";
 if (downlimit == null)
  {
   reg = eval_r("/^[0-9]{"+uplimit+"}$/");
  }
 else
  {
   reg = eval_r("/^[0-9]{"+uplimit+","+downlimit+"}$/");
  }
 var str = obj.value;
 var flag = reg.test(str);
 return flag;
}
//************************************************
//检查身份证号
function IdCardRegCheck(obj)
{
 var str = obj.value;
 var reg = /^([0-9]{15}|[0-9]{18})$/;
 var flag = reg.test(str);
 return flag;
}
//************************************************
//检查EMAIL
function EmailRegCheck(obj)
{
 var str = obj.value;
 var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
 var flag = reg.test(str);
 return flag;
}
//***************************************
//检查中文输入
function CnWordRegCheck(obj)
{
 var str = obj.value;
 var reg=/^[\u4e00-\u9fa5](\s*[\u4e00-\u9fa5])*$/;
 var flag = reg.test(str);
 //alert(flag);
 return flag;
}
//***************************************
//检查特殊字符
function SpecialWordRegCheck(obj)
{
 var reg= /[(\/)(<)(>)]/g">\\)(')(")(<)(>)]/g;
 var str = obj.value;
 var flag= reg.test(str);
 flag = !flag;
 return flag;
}
//************************************************
//检查主引导函数
function CheckForm(obj)
{
 var myform = eval_r("document."+obj.name);
 for (i=0;i<myform.elements.length;i++)
  {
  var formvalue = myform.elements[i].value;
  //内容非空检查,长度检查
  if ((myform.elements[i].value == "")||(myform.elements[i].value.length>myform.elements[i].maxlength))
   {
   alert("您忘了填写"+myform.elements[i].cnname+"!"+"或者您填写的信息不符合规范!");
   myform.elements[i].focus();
   return false;
   break;
   }
   if (myform.elements[i].value == 0)
   {
   alert("您忘了选择"+myform.elements[i].cnname+"!");
   myform.elements[i].focus();
   return false;
   break;
   }
  //数据规范化检查
  var myobj = myform.elements[i];
  //alert(myobj.checktype);
  //break;
  if (!RegCheck(myobj))
   {
   alert(myobj.cnname+"输入有误,请按填写要求填写!");
    myobj.focus();
   return false;
   break;
   }
  }
}

附:js身份证号码严格验证

<script>
function checkIdcard(idcard){
var Errors=new Array(
"验证通过!",
"身份证号码位数不对!",
"身份证号码出生日期超出范围或含有非法字符!",
"身份证号码校验错误!",
"身份证地区非法!"
);
var area={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:"国外"}
var idcard,Y,JYM;
var S,M;
var idcard_array = new Array();
idcard_array = idcard.split("");
//地区检验
if(area[parseInt(idcard.substr(0,2))]==null) return Errors[4];
//身份号码位数及格式检验
switch(idcard.length){
case 15:
if ( (parseInt(idcard.substr(6,2))+1900) % 4 == 0 || ((parseInt(idcard.substr(6,2))+1900) % 100 == 0 && (parseInt(idcard.substr(6,2))+1900) % 4 == 0 )){
ereg=/^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}$/;//测试出生日期的合法性
} else {
ereg=/^[1-9][0-9]{5}[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}$/;//测试出生日期的合法性
}
if(ereg.test(idcard)) return Errors[0];
else return Errors[2];
break;
case 18:
//18位身份号码检测
//出生日期的合法性检查
//闰年月日:((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))
//平年月日:((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))
if ( parseInt(idcard.substr(6,4)) % 4 == 0 || (parseInt(idcard.substr(6,4)) % 100 == 0 && parseInt(idcard.substr(6,4))%4 == 0 )){
ereg=/^[1-9][0-9]{5}19[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}[0-9Xx]$/;//闰年出生日期的合法性正则表达式
} else {
ereg=/^[1-9][0-9]{5}19[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|3[0-1])|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|1[0-9]|2[0-8]))[0-9]{3}[0-9Xx]$/;//平年出生日期的合法性正则表达式
}
if(ereg.test(idcard)){//测试出生日期的合法性
//计算校验位
S = (parseInt(idcard_array[0]) + parseInt(idcard_array[10])) * 7
+ (parseInt(idcard_array[1]) + parseInt(idcard_array[11])) * 9
+ (parseInt(idcard_array[2]) + parseInt(idcard_array[12])) * 10
+ (parseInt(idcard_array[3]) + parseInt(idcard_array[13])) * 5
+ (parseInt(idcard_array[4]) + parseInt(idcard_array[14])) * 8
+ (parseInt(idcard_array[5]) + parseInt(idcard_array[15])) * 4
+ (parseInt(idcard_array[6]) + parseInt(idcard_array[16])) * 2
+ parseInt(idcard_array[7]) * 1
+ parseInt(idcard_array[8]) * 6
+ parseInt(idcard_array[9]) * 3 ;
Y = S % 11;
M = "F";
JYM = "10X98765432";
M = JYM.substr(Y,1);//判断校验位
if(M == idcard_array[17]) return Errors[0]; //检测ID的校验位
else return Errors[3];
}
else return Errors[2];
break;
default:
return Errors[1];
break;
}
}
alert(checkIdcard("220183198808081610"))
</script>
Javascript 相关文章推荐
JQUERY 实现窗口滚动搜索框停靠效果(类似滚动停靠)
Mar 27 Javascript
JS使用JSON作为参数实例分析
Jun 23 Javascript
JS动态给对象添加事件的简单方法
Jul 19 Javascript
JS调用某段SQL语句的方法
Oct 20 Javascript
最常见的左侧分类菜单栏jQuery实现代码
Nov 28 Javascript
Jquery把获取到的input值转换成json
May 15 jQuery
微信小程序开发之map地图实现教程
Jun 08 Javascript
详解微信UnionID作用
May 15 Javascript
layui自定义ajax左侧三级菜单
Jul 26 Javascript
java遇到微信小程序 &quot;支付验证签名失败&quot; 问题解决
Dec 22 Javascript
jQuery实现移动端笔触canvas电子签名
May 21 jQuery
vue-router懒加载的3种方式汇总
Feb 28 Vue.js
canvas实现十二星座星空图
Feb 14 #Javascript
JavaScript省市级联下拉菜单实例
Feb 14 #Javascript
jqGrid翻页时数据选中丢失问题的解决办法
Feb 13 #Javascript
jQuery实现用户输入自动完成功能
Feb 13 #Javascript
微信小程序 详解页面跳转与返回并回传数据
Feb 13 #Javascript
微信小程序 this和that详解及简单实例
Feb 13 #Javascript
脚本div实现拖放功能(两种)
Feb 13 #Javascript
You might like
广播爱好者需要了解的天线知识
2021/03/01 无线电
phpmyadmin3 安装配置图解教程
2012/03/29 PHP
thinkPHP中create方法与令牌验证实例浅析
2015/12/08 PHP
理解php依赖注入和控制反转
2016/05/11 PHP
php实现在新浪云中使用imagick生成缩略图并上传的方法
2016/09/26 PHP
JavaScript AOP编程实例
2015/06/16 Javascript
jQuery插件formValidator实现表单验证
2016/05/23 Javascript
bootstrap modal弹出框的垂直居中
2016/12/14 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
2016/12/23 Javascript
JavaScript使用FileReader实现图片上传预览效果
2020/03/27 Javascript
JS插件clipboard.js实现一键复制粘贴功能
2020/12/04 Javascript
vue通过cookie获取用户登录信息的思路详解
2018/10/30 Javascript
JS实现的类似微信聊天效果示例
2019/01/29 Javascript
NodeJS有难度的面试题(能答对几个)
2019/10/09 NodeJs
Jquery 动态添加元素并添加点击事件实现过程解析
2019/10/12 jQuery
[02:48]DOTA2英雄基础教程 拉席克
2013/12/12 DOTA
python使用reportlab画图示例(含中文汉字)
2013/12/03 Python
PYTHON压平嵌套列表的简单实现
2016/06/08 Python
python实现画圆功能
2018/01/25 Python
Python cookbook(数据结构与算法)在字典中将键映射到多个值上的方法
2018/02/18 Python
python中ImageTk.PhotoImage()不显示图片却不报错问题解决
2018/12/06 Python
python基于SMTP协议发送邮件
2019/05/31 Python
python实现凯撒密码、凯撒加解密算法
2020/06/11 Python
2021年的Python 时间轴和即将推出的功能详解
2020/07/27 Python
详解pytorch tensor和ndarray转换相关总结
2020/09/03 Python
python代数式括号有效性检验示例代码
2020/10/04 Python
利用python爬取有道词典的方法
2020/12/08 Python
使用CSS3实现多列布局与多背景的技巧
2016/02/29 HTML / CSS
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
Harrods英国:世界领先的奢侈品百货商店
2020/09/23 全球购物
公司出纳岗位职责
2013/12/07 职场文书
会计岗位说明书
2014/07/29 职场文书
家具商场的活动方案
2014/08/16 职场文书
个人作风建设自查报告
2014/10/22 职场文书
信访稳定工作汇报
2014/10/27 职场文书
教师创先争优承诺书
2015/04/27 职场文书