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 相关文章推荐
[推荐]javascript 面向对象技术基础教程
Mar 03 Javascript
jquery 获取json数据实现代码
Apr 27 Javascript
date.parse在IE和FF中的区别
Jul 29 Javascript
JS教程:window.location使用方法的区别介绍
Oct 04 Javascript
jQuery获取iframe的document对象的方法
Oct 10 Javascript
AngularJS表单编辑提交功能实例
Feb 13 Javascript
JavaScript中Date.toSource()方法的使用教程
Jun 12 Javascript
javascript数据类型验证方法
Dec 31 Javascript
BootStrap入门教程(一)之可视化布局
Sep 19 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
Dec 08 Javascript
js移动端图片压缩上传功能
Aug 18 Javascript
vue中移动端调取本地的复制的文本方式
Jul 18 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
PHP实现数字补零功能的2个函数介绍
2014/05/12 PHP
PHP实现的简单三角形、矩形周长面积计算器分享
2014/11/18 PHP
php自动给网址加上链接的方法
2015/06/02 PHP
php抽象类用法实例分析
2015/07/07 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
如何修改Laravel中url()函数生成URL的根地址
2017/08/11 PHP
javascript dom追加内容实现示例
2013/09/21 Javascript
谈谈JavaScript自定义回调函数
2015/10/18 Javascript
Knockout自定义绑定创建方法
2015/12/26 Javascript
JS随机排序数组实现方法分析
2017/10/11 Javascript
微信小程序支付及退款流程详解
2017/11/30 Javascript
微信小程序云开发(数据库)详解
2019/05/17 Javascript
微信小程序云开发实现数据添加、查询和分页
2019/05/17 Javascript
layui点击按钮页面会自动刷新的解决方案
2019/10/25 Javascript
原生javascript如何实现共享onload事件
2020/07/03 Javascript
web.py获取上传文件名的正确方法
2014/08/26 Python
Python中列表、字典、元组、集合数据结构整理
2014/11/20 Python
Python验证文件是否可读写代码分享
2017/12/11 Python
python对csv文件追加写入列的方法
2019/08/01 Python
python线程安全及多进程多线程实现方法详解
2019/09/27 Python
python变量的作用域是什么
2020/05/26 Python
Lands’ End官网:经典的美国生活方式品牌
2016/08/14 全球购物
BONIA波尼亚新加坡官网:皮革手袋,鞋类和配件
2016/08/25 全球购物
美国时尚假发购物网站:Wigsbuy
2019/04/06 全球购物
介绍一下linux文件系统分配策略
2013/02/25 面试题
JAVA招聘远程笔试题
2015/07/23 面试题
J2EE面试题大全
2016/08/06 面试题
工商管理实习自我鉴定
2013/09/28 职场文书
模具设计与制造专业推荐信
2014/02/16 职场文书
经济管理专业求职信
2014/06/09 职场文书
班级团队活动方案
2014/08/14 职场文书
竞聘报告优秀范文
2014/11/06 职场文书
2015年酒店客房部工作总结
2015/04/25 职场文书
退休教师欢送会致辞
2015/07/31 职场文书
MySQL连接控制插件介绍
2021/09/25 MySQL
vue使用element-ui按需引入
2022/05/20 Vue.js