值得收藏的八个常用的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 相关文章推荐
类之Prototype.js学习
Jun 13 Javascript
一个简单的jQuery计算器实现了连续计算功能
Jul 21 Javascript
jQuery中复合属性选择器用法实例
Dec 31 Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 Javascript
Js数组排序函数sort()介绍
Jun 08 Javascript
jQuery网页右侧广告跟随滚动代码分享
Apr 20 Javascript
js类式继承与原型式继承详解
Apr 07 Javascript
switch语句的妙用(必看篇)
Oct 03 Javascript
js实现适配不同的屏幕大小
Apr 10 Javascript
JavaScript实现星级评价效果
May 17 Javascript
js实现课堂随机点名系统
Nov 21 Javascript
Vuejs中的watch实例详解(监听者)
Jan 05 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
Symfony生成二维码的方法
2016/02/04 PHP
Laravel5.1 框架Request请求操作常见用法实例分析
2020/01/04 PHP
JSON 入门指南 想了解json的朋友可以看下
2009/08/26 Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
2016/06/09 Javascript
详解vue路由篇(动态路由、路由嵌套)
2019/01/27 Javascript
js实现贪吃蛇小游戏
2019/10/29 Javascript
详解JavaScript数据类型和判断方法
2020/09/04 Javascript
浅析微信小程序自定义日历组件及flex布局最后一行对齐问题
2020/10/29 Javascript
Js利用正则表达式去除字符串的中括号
2020/11/23 Javascript
如何使用原生Js实现随机点名详解
2021/01/06 Javascript
[06:23]2014DOTA2西雅图国际邀请赛 小组赛7月12日TOPPLAY
2014/07/12 DOTA
[00:12]2018DOTA2亚洲邀请赛 Somnus丶M出阵单挑
2018/04/06 DOTA
python中随机函数random用法实例
2015/04/30 Python
Python 中迭代器与生成器实例详解
2017/03/29 Python
Python DataFrame.groupby()聚合函数,分组级运算
2018/09/18 Python
浅析Python四种数据类型
2018/09/26 Python
Python面向对象之类的定义与继承用法示例
2019/01/14 Python
Python2与Python3的区别点整理
2019/12/12 Python
浅谈keras 模型用于预测时的注意事项
2020/06/27 Python
Python绘图之二维图与三维图详解
2020/08/04 Python
python em算法的实现
2020/10/03 Python
加拿大时装零售商:Influence U
2018/12/22 全球购物
医药大学生求职简历的自我评价
2013/10/17 职场文书
社区包粽子活动方案
2014/01/21 职场文书
奥林匹克的口号
2014/06/13 职场文书
搞笑车尾标语
2014/06/23 职场文书
英文演讲稿开场白
2014/08/25 职场文书
2016年党风廉政建设承诺书
2016/03/25 职场文书
三年级作文之趣事作文
2019/11/04 职场文书
CSS 制作波浪效果的思路
2021/05/18 HTML / CSS
MySql存储过程之逻辑判断和条件控制
2021/05/26 MySQL
Java实现二维数组和稀疏数组之间的转换
2021/06/27 Java/Android
Nginx stream 配置代理(Nginx TCP/UDP 负载均衡)
2021/11/17 Servers
【D4DJ】美少女DJ企划 动画将于明年冬季开播第2季
2022/04/11 日漫
Spring JPA 增加字段执行异常问题及解决
2022/06/10 Java/Android
利用Apache Common将java对象池化的问题
2022/06/16 Servers