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 Calender控件使用详解
Jan 05 Javascript
js图片轮播特效代码分享
Sep 07 Javascript
JavaScript实现点击按钮切换网页背景色的方法
Oct 17 Javascript
Bootstrap表单组件教程详解
Apr 26 Javascript
使用Web Uploader实现多文件上传
Jun 08 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
Dec 01 Javascript
原生js实现放大镜
Feb 20 Javascript
JS变量及其作用域
Mar 29 Javascript
剖析Angular Component的源码示例
Mar 23 Javascript
微信小程序如何调用json数据接口并解析
Jun 29 Javascript
详解关于Vue单元测试的几个坑
Apr 26 Javascript
JS 创建对象的模式实例小结
Apr 28 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的日期与时间函数技巧
2008/04/24 PHP
CI框架在CLI下执行占用内存过大问题的解决方法
2014/06/17 PHP
ThinkPHP静态缓存简单配置和使用方法详解
2016/03/23 PHP
PHP使用file_get_contents发送http请求功能简单示例
2018/04/29 PHP
Thinkphp 框架扩展之数据库驱动常用方法小结
2020/04/23 PHP
如何实现浏览器上的右键菜单
2006/07/10 Javascript
提高javascript效率 一次判断,而不要次次判断
2012/03/30 Javascript
一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子
2014/06/26 Javascript
jQuery实现单击和鼠标感应事件
2015/02/01 Javascript
JS当前页面登录注册框,固定DIV,底层阴影的实例代码
2016/09/29 Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
2017/02/17 Javascript
微信小程序 页面跳转及数据传递详解
2017/03/14 Javascript
Bootstrap警告框(Alert)插件使用方法
2017/03/21 Javascript
vue.js 上传图片实例代码
2017/06/22 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
2018/08/22 Javascript
微信小程序之事件交互操作实例分析
2018/12/03 Javascript
[04:07]显微镜下的DOTA2第八期——英雄复活动作
2014/06/24 DOTA
Python高效编程技巧
2013/01/07 Python
python使用cookie库操保存cookie详解
2014/03/03 Python
Python中的生成器和yield详细介绍
2015/01/09 Python
django实现用户登陆功能详解
2017/12/11 Python
python命令行解析之parse_known_args()函数和parse_args()使用区别介绍
2018/01/24 Python
详解利用Python scipy.signal.filtfilt() 实现信号滤波
2019/06/05 Python
python实现七段数码管和倒计时效果
2019/11/23 Python
linux 下python多线程递归复制文件夹及文件夹中的文件
2020/01/02 Python
TensorFlow学习之分布式的TensorFlow运行环境
2020/02/05 Python
Python tempfile模块生成临时文件和临时目录
2020/09/30 Python
css3 border旋转时的动画应用
2016/01/22 HTML / CSS
Casadei卡萨蒂官网:意大利奢侈鞋履品牌
2017/10/28 全球购物
住房公积金接收函
2014/01/09 职场文书
上班早退检讨书
2014/01/09 职场文书
简历自我评价模版
2014/01/31 职场文书
《爱如茉莉》教后反思
2014/04/12 职场文书
护士工作心得体会
2016/01/25 职场文书
Python快速优雅的批量修改Word文档样式
2021/05/20 Python
pandas:get_dummies()与pd.factorize()的用法及区别说明
2021/05/21 Python