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 相关文章推荐
用prototype实现的简单小巧的多级联动菜单
Mar 24 Javascript
原生javascript实现图片轮播效果代码
Sep 03 Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 Javascript
通过jQuery源码学习javascript(二)
Dec 27 Javascript
js中的replace方法使用介绍
Oct 28 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 Javascript
Bootstrap精简教程中秋大放送
Sep 15 Javascript
微信小程序使用npm支持踩坑
Nov 07 Javascript
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
服务端预渲染之Nuxt(使用篇)
Apr 08 Javascript
小程序选项卡以及swiper套用(跨页面)
Jun 19 Javascript
express异步函数异常捕获示例详解
Nov 30 Javascript
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
javascript打印输出json实例
2013/11/11 Javascript
js实现上传图片及时预览
2016/05/07 Javascript
JavaScript操作选择对象的简单实例
2016/05/16 Javascript
Google 地图事件实例讲解
2016/08/06 Javascript
javascript基础知识之html5轮播图实例讲解(44)
2017/02/17 Javascript
angularjs 动态从后台获取下拉框的值方法
2018/08/13 Javascript
vue填坑之webpack run build 静态资源找不到的解决方法
2018/09/03 Javascript
angular使用md5,CryptoJS des加密的方法
2019/06/03 Javascript
JavaScript动画实例之粒子文本的实现方法详解
2020/07/28 Javascript
[00:47]TI7不朽珍藏III——沙王不朽展示
2017/07/15 DOTA
[50:21]Liquid vs Winstrike 2018国际邀请赛小组赛BO2 第二场
2018/08/19 DOTA
[01:08:00]Fnatic vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
浅谈插入排序算法在Python程序中的实现及简单改进
2016/05/04 Python
python使用xlrd与xlwt对excel的读写和格式设定
2017/01/21 Python
python实现员工管理系统
2018/01/11 Python
python-opencv 将连续图片写成视频格式的方法
2019/01/08 Python
django与小程序实现登录验证功能的示例代码
2019/02/19 Python
钉钉群自定义机器人消息Python封装的实例
2019/02/20 Python
使用selenium和pyquery爬取京东商品列表过程解析
2019/08/15 Python
浅谈tensorflow 中的图片读取和裁剪方式
2020/06/30 Python
详解Css3新特性应用之过渡与动画
2017/01/10 HTML / CSS
基于CSS3的CSS 多栏(Multi-column)实现瀑布流源码分享
2014/06/11 HTML / CSS
中国汽车租赁行业头部企业:一嗨租车
2019/05/16 全球购物
How TDD works
2012/09/30 面试题
集体婚礼证婚词
2014/01/13 职场文书
高中运动会广播稿
2014/01/21 职场文书
大学毕业生求职自荐信
2014/02/20 职场文书
企业优秀团员事迹材料
2014/08/20 职场文书
2014年平安建设工作总结
2014/11/19 职场文书
2014年安置帮教工作总结
2014/12/11 职场文书
2015年国庆节慰问信
2015/03/23 职场文书
离婚起诉书范文2016
2015/11/26 职场文书
退休劳动合同怎么写?
2019/10/25 职场文书
如何用PHP实现多线程编程
2021/05/26 PHP
python模块与C和C++动态库相互调用实现过程示例
2021/11/02 Python
WINDOWS 64位 下安装配置mysql8.0.25最详细的教程
2022/03/22 MySQL