值得收藏的八个常用的js正则表达式


Posted in Javascript onOctober 19, 2018

 开发中如果有input输入框,难免就要写正则表达式,因此在这里总结了一些常见常用的正则表达式的书写方法,希望会大家有所帮助;

附图:  

值得收藏的八个常用的js正则表达式

一.手机号码

$(document).ready(function(){
  //判断输入手机号码是否正确
  $("#telephone").focus(function(){
     document.getElementById("ph-hint").innerHTML = ":open_mouth:请输入11位手机号码";

  })
  $("#telephone").blur(function(){
     if(/^((13[0-9])|(15[^4,\D])|(18[0-9]))\d{8}$/.test(this.value)){
        document.getElementById("ph-hint").innerHTML = "";
     }else if(document.getElementById("telephone").value == ""){
         document.getElementById("ph-hint").innerHTML = " 咦,手机号不能为空哦";
     }else{
        document.getElementById("ph-hint").innerHTML = " 这好像不是一个手机号码哦";
        document.getElementById("telephone").value = "";
     }
  })
})

详解:当获取焦点时,提示文字请输入手机号,然后失去焦点时判断,那段正则表达式表示的是13几,这个几0-9都可以,或者15几,但是非4的都行,或者18几,0-9都可以,然后再加8位数字,符合条件则成功,否则根据情况判断提示文字;

二.密码

$(document).ready(function(){
  //判断输入密码格式是否正确
  $("#setpassword").focus(function(){
     document.getElementById("pw-hint").innerHTML = ":open_mouth:请您输入密码,6-15个字母数字和符号两种以上组合";

  })
  $("#setpassword").blur(function(){
     if(/^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?![,\.#%'\+\*\-:;^_`]+$)[,\.#%'\+\*\-:;^_`0-9A-Za-z]{6,15}$/.test(this.value)){
        document.getElementById("pw-hint").innerHTML = "";
     }else if(document.getElementById("setpassword").value == ""){
         document.getElementById("pw-hint").innerHTML = " 咦,密码不能为空哦";
     }else{
        document.getElementById("pw-hint").innerHTML = " 你的密码格式有误,请重新输入";
        document.getElementById("setpassword").value = "";
     }
  })
})

详解:当获取焦点时,提示文字请输入密码,然后失去焦点时判断,那段正则表达式表示的是可以输入0-9的数字和大小写的字母a-z,外加一些特殊符号,然后可以输入6-15位密码,符合条件则成功,否则根据情况判断提示文字;

*以下格式我就不这样写了,简介一点,上面两段可以去参考。

三.用户名

//用户名正则,4到16位(字母,数字,下划线,减号)
var username = /^[a-zA-Z0-9_-]{4,16}$/;
//文字
var username=/[\d]/g;

四.电子邮箱

//对电子邮件的验证
 var email = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;

五.身份证号

//身份证号(18位)正则
var cP = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;

六.日期

//日期正则,简单判定,未做月份及日期的判定
var time = /^\d{4}(\-)\d{1,2}\1\d{1,2}$/;
//日期正则,复杂判定
var time = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;

七.QQ号以及微信号

//QQ号正则,5至11位
var qq = /^[1-9][0-9]{4,10}$/;
//微信号正则,6至20位,以字母开头,字母,数字,减号,下划线
var wx = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;

八.座机号

//座机号
var tel =/(^0\d{2}-8\d{7}$)|(^0\d{3}-3\d{6}$)/;

附加: 发送验证码倒计时写法

<input class="login-code-send" id="login-code-send" type="button" name="sendcode" value="发送验证码" onclick="settime(this);"/>
//登录,忘记密码的验证码
var counts = 60;
function settime(val) {
  if (counts == 0) {
    val.removeAttribute("disabled");
    val.value = "获取验证码";
    counts = 60;
    return false;
  } else {
    val.setAttribute("disabled", true);
    val.value = "重新发送("+counts+")";
    counts--;
  }
  setTimeout(function () {
    settime(val);
  }, 1000);
}

总结

以上所述是小编给大家介绍的值得收藏的八个常用的js正则表达式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
打造基于jQuery的高性能TreeView(asp.net)
Feb 23 Javascript
js定时器怎么写?就是在特定时间执行某段程序
Oct 11 Javascript
jQuery 滑动方法slideDown向下滑动元素
Jan 16 Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
Jan 26 Javascript
分享9个最好用的JavaScript开发工具和代码编辑器
Mar 24 Javascript
使用impress.js制作幻灯片
Sep 09 Javascript
Vue.js中关于侦听器(watch)的高级用法示例
May 02 Javascript
vue嵌套路由与404重定向实现方法分析
May 04 Javascript
前端插件之Bootstrap Dual Listbox使用教程
Jul 23 Javascript
webpack3升级到webpack4遇到问题总结
Sep 30 Javascript
JavaScript数值类型知识汇总
Nov 17 Javascript
vant实现购物车功能
Jun 29 Javascript
深入理解移动前端开发之viewport
Oct 19 #Javascript
vue移动端html5页面根据屏幕适配的四种解决方法
Oct 19 #Javascript
Vue用v-for给循环标签自身属性添加属性值的方法
Oct 18 #Javascript
vue中v-for循环给标签属性赋值的方法
Oct 18 #Javascript
webstorm+vue初始化项目的方法
Oct 18 #Javascript
使用微信小程序开发弹出框应用实例详解
Oct 18 #Javascript
vue: WebStorm设置快速编译运行的方法
Oct 18 #Javascript
You might like
在任意字符集下正常显示网页的方法二(续)
2007/04/01 PHP
使用PHP 5.0创建图形的巧妙方法
2010/10/12 PHP
php中将指针移动到数据集初始位置的实现代码[mysql_data_seek]
2012/11/01 PHP
Yii实现简单分页的方法
2016/04/29 PHP
php的常量和变量实例详解
2017/06/27 PHP
jQuery实现点击文本框弹出热门标签的提示效果
2013/11/17 Javascript
node.js中的fs.readFileSync方法使用说明
2014/12/15 Javascript
jQuery中siblings()方法用法实例
2015/01/08 Javascript
jQuery团购倒计时特效实现方法
2015/05/07 Javascript
浅析JavaScript中的变量复制、参数传递和作用域链
2016/01/13 Javascript
超全面的javascript中变量命名规则
2017/02/09 Javascript
详解vue2路由vue-router配置(懒加载)
2017/04/08 Javascript
javaScript 逻辑运算符使用技巧整理
2017/05/03 Javascript
Vue.js项目中管理每个页面的头部标签的两种方法
2018/06/25 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
2019/09/28 Javascript
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
python目录操作之python遍历文件夹后将结果存储为xml
2014/01/27 Python
详解python基础之while循环及if判断
2017/08/24 Python
Python图像的增强处理操作示例【基于ImageEnhance类】
2019/01/03 Python
python 画二维、三维点之间的线段实现方法
2019/07/07 Python
Python使用lambda表达式对字典排序操作示例
2019/07/25 Python
Flask使用Pyecharts在单个页面展示多个图表的方法
2019/08/05 Python
python常用运维脚本实例小结
2020/02/14 Python
python实现AHP算法的方法实例(层次分析法)
2020/09/09 Python
澳大利亚自然和有机的健康美容产品一站式商店:Ziani Beauty
2017/12/28 全球购物
家电业务员岗位职责
2014/03/10 职场文书
报纸媒体创意广告词
2014/03/17 职场文书
暑假学习心得体会
2014/09/02 职场文书
面试通知单大全
2015/04/20 职场文书
调任通知
2015/04/21 职场文书
2016年中秋节慰问信
2015/12/01 职场文书
何时使用Map来代替普通的JS对象
2021/04/29 Javascript
Python Parser的用法
2021/05/12 Python
Linux系统下安装PHP7.3版本
2021/06/26 PHP
CSS SandBox应用场景及常见问题
2022/06/25 HTML / CSS