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 相关文章推荐
js模拟实现Array的sort方法
Dec 11 Javascript
js截取函数(indexOf,join等)
Sep 01 Javascript
使用jQuery全局事件ajaxStart为特定请求实现提示效果的代码
Dec 30 Javascript
JavaScript 判断用户输入的邮箱及手机格式是否正确
Dec 08 Javascript
禁止页面刷新让F5快捷键及右键都无效
Jan 22 Javascript
js调用浏览器打印模块实现点击按钮触发自定义函数
Mar 21 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
Apr 06 Javascript
javascript中的replace函数(带注释demo)
Jan 07 Javascript
小程序实现左滑删除功能
Oct 30 Javascript
JS实现指定区域的全屏显示功能示例
Apr 25 Javascript
vuex实现像调用模板方法一样调用Mutations方法
Nov 06 Javascript
原生JS实现分页
Apr 19 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
对text数据类型不支持代码页转换 从: 1252 到: 936
2011/04/23 PHP
php不用正则验证真假身份证
2013/11/06 PHP
php实现常见图片格式的水印和缩略图制作(面向对象)
2016/06/15 PHP
Mootools 1.2教程 Tooltips
2009/09/15 Javascript
JQuery获取文本框中字符长度的代码
2011/09/29 Javascript
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
js实现页面转发功能示例代码
2013/08/05 Javascript
原生js编写autoComplete插件
2016/04/13 Javascript
Angular4学习笔记之新建项目的方法
2017/07/18 Javascript
微信小程序-滚动消息通知的实例代码
2017/08/03 Javascript
Express使用html模板的详细代码
2017/09/18 Javascript
搭建element-ui的Vue前端工程操作实例
2018/02/23 Javascript
详解基于mpvue的小程序markdown适配解决方案
2018/05/08 Javascript
Nginx设置为Node.js的前端服务器方法总结
2019/03/27 Javascript
详解微信小程序文件下载--视频和图片
2019/04/24 Javascript
vue中利用Promise封装jsonp并调取数据
2019/06/18 Javascript
[00:23]DOTA2群星共贺开放测试 25日无码时代来袭
2013/09/23 DOTA
用Python脚本生成Android SALT扰码的方法
2013/09/18 Python
python打开文件并获取文件相关属性的方法
2015/04/23 Python
Python文档生成工具pydoc使用介绍
2015/06/02 Python
python验证码识别教程之利用投影法、连通域法分割图片
2018/06/04 Python
python 读取txt,json和hdf5文件的实例
2018/06/05 Python
Django如何将URL映射到视图
2019/07/29 Python
python自动化工具之pywinauto实例详解
2019/08/26 Python
解决Python使用列表副本的问题
2019/12/19 Python
Python lambda表达式原理及用法解析
2020/08/18 Python
如何基于Django实现上下文章跳转
2020/09/16 Python
如何在Canvas中添加事件的方法示例
2019/05/21 HTML / CSS
英国知名奢侈品包包品牌:Milli Millu
2016/12/22 全球购物
香港通票:Hong Kong Pass
2019/02/26 全球购物
俄罗斯领先的移动和数字设备在线商店:Svyaznoy.ru
2020/12/21 全球购物
程序员求职信
2014/04/16 职场文书
2014年秋季开学演讲稿
2014/05/24 职场文书
住房抵押登记委托书
2014/09/27 职场文书
Idea连接MySQL数据库出现中文乱码的问题
2021/04/14 MySQL
python基于opencv批量生成验证码的示例
2021/04/28 Python