jquery正则表达式验证(手机号、身份证号、中文名称)


Posted in Javascript onDecember 31, 2015

本文实例需要验证的内容:中文姓名、手机号、身份证和地址,验证方法分享给大家供大家参考,具体内容如下

HTML(表单):

<form action="">
 <div class="form-group">
  <label>姓名:</label>
  <input id="name" type="text">
 </div>
 <div class="form-group">
  <label>手机号:</label>
  <input id="phone" type="text">
 </div>
 <div class="form-group">
  <label>身份证:</label>
  <input id="identity" type="text">
 </div>
 <div class="form-group">
  <label class="label-textarea">邮寄地址:</label>
  <textarea id="address"></textarea>
 </div>
 <p class="tip">请填写实名认证信息,以便领奖资料一经提交无法修改,请慎重填写!</p>
 <div class="btn-group">
  <button class="btn btn-md btn-purple" type="reset">取消</button>
  <button class="btn btn-md btn-purple ml-20" id="submit" type="button">提交</button>
 </div>
</form>

jQuery验证:

test()方法 判断字符串中是否匹配到正则表达式内容,返回的是boolean值 ( true / false )

// 验证中文名称
function isChinaName(name) {
 var pattern = /^[\u4E00-\u9FA5]{1,6}$/;
 return pattern.test(name);
}

// 验证手机号
function isPhoneNo(phone) { 
 var pattern = /^1[34578]\d{9}$/; 
 return pattern.test(phone); 
}

// 验证身份证 
function isCardNo(card) { 
 var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; 
 return pattern.test(card); 
} 

// 验证函数
function formValidate() {
 var str = '';

 // 判断名称
 if($.trim($('#name').val()).length == 0) {
  str += '名称没有输入\n';
  $('#name').focus();
 } else {
  if(isChinaName($.trim($('#name').val())) == false) {
   str += '名称不合法\n';
   $('#name').focus();
  }
 }

 // 判断手机号码
 if ($.trim($('#phone').val()).length == 0) { 
  str += '手机号没有输入\n';
  $('#phone').focus();
 } else {
  if(isPhoneNo($.trim($('#phone').val()) == false)) {
   str += '手机号码不正确\n';
   $('#phone').focus();
  }
 }

 // 验证身份证
 if($.trim($('#identity').val()).length == 0) { 
  str += '身份证号码没有输入\n';
  $('#identity').focus();
 } else {
  if(isCardNo($.trim($('#identity').val())) == false) {
   str += '身份证号不正确;\n';
   $('#identity').focus();
  }
 }

 // 验证地址
 if($.trim($('#address').val()).length == 0) { 
  str += '地址没有输入\n';
  $('#address').focus();
 }

 // 如果没有错误则提交
 if(str != '') {
  alert(str);
  return false;
 } else {
  $('.auth-form').submit();
 }
}

$('#submit').on('click', function() {
 formValidate();
});

希望本文所述对大家学习jquery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript定义类或函数的几种方式小结
Jan 09 Javascript
浅析Prototype的模板类 Template
Dec 07 Javascript
正则表达式(语法篇推荐)
Jun 24 Javascript
JS克隆,属性,数组,对象,函数实例分析
Nov 26 Javascript
浅析JavaScript动画模拟拖拽原理
Dec 09 Javascript
js时间控件只显示年月
Jan 08 Javascript
AngularJS自定义指令实现面包屑功能完整实例
May 17 Javascript
vue使用better-scroll实现下拉刷新、上拉加载
Nov 23 Javascript
记录一次开发微信网页分享的步骤
May 07 Javascript
vue的keep-alive用法技巧
Aug 15 Javascript
使用Node.js在深度学习中做图片预处理的方法
Sep 18 Javascript
vue实现购物车选择功能
Jan 10 Javascript
jQuery语法小结(超实用)
Dec 31 #Javascript
解决JS无法调用Controller问题的方法
Dec 31 #Javascript
简单谈谈JavaScript的同步与异步
Dec 31 #Javascript
jQuery实现简单的图片查看器
Sep 11 #Javascript
值得分享的Bootstrap Ace模板实现菜单和Tab页效果
Dec 30 #Javascript
基于jQuery实现美观且实用的倒计时实例代码
Dec 30 #Javascript
基于JavaScript实现手机短信按钮倒计时(超简单)
Dec 30 #Javascript
You might like
php set_time_limit()函数的使用详解
2013/06/05 PHP
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
对PHP语言认识上需要避免的10大误区
2014/06/12 PHP
thinkphp3.2实现上传图片的控制器方法
2016/04/28 PHP
ThinkPHP中Widget扩展的两种写法及调用方法详解
2017/05/04 PHP
PHP中include和require的区别实例分析
2017/05/07 PHP
PHP实现统计所有字符在字符串中出现次数的方法
2017/10/17 PHP
laravel excel 上传文件保存到本地服务器功能
2019/11/14 PHP
xml文档转换工具,附图表例子(hta)
2010/11/17 Javascript
ExtJs使用总结(非常详细)
2012/03/22 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
2014/05/05 Javascript
在 Express 中使用模板引擎
2015/12/10 Javascript
jquery+json实现动态商品内容展示的方法
2016/01/14 Javascript
JS小数运算出现多为小数问题的解决方法
2016/06/02 Javascript
Angular.JS中select下拉框设置value的方法
2017/06/20 Javascript
使用vue根据状态添加列表数据和删除列表数据的实例
2018/09/29 Javascript
layer的prompt弹出框,点击回车,触发确定事件的方法
2019/09/06 Javascript
vue实现顶部菜单栏
2020/11/08 Javascript
浅谈Python peewee 使用经验
2017/10/20 Python
Python使用matplotlib实现绘制自定义图形功能示例
2018/01/18 Python
Flask和Django框架中自定义模型类的表名、父类相关问题分析
2018/07/19 Python
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
pandas 选取行和列数据的方法详解
2019/08/08 Python
python实现录屏功能(亲测好用)
2020/03/02 Python
python2.7使用scapy发送syn实例
2020/05/05 Python
python中最小二乘法详细讲解
2021/02/19 Python
HTML5 Canvas 起步(1) - 基本概念
2009/05/12 HTML / CSS
日本无添加化妆品:HABA
2016/08/18 全球购物
伦敦的高级牛仔布专家:Trilogy
2018/08/06 全球购物
运动会广播稿150字
2014/02/19 职场文书
募捐倡议书
2014/04/14 职场文书
学校搬迁方案
2014/06/15 职场文书
晋江市人民政府党组群众路线教育实践活动整改方案
2014/10/25 职场文书
社会主义核心价值观主题教育活动总结
2015/05/07 职场文书
python flappy bird小游戏分步实现流程
2022/02/15 Python
win10壁纸在哪个文件夹 win10桌面背景图片文件位置分享
2022/08/05 数码科技