js如何使用正则表达式验证电话号码（可选区号）和邮箱？（分步骤）

最新推荐文章于 2023-07-06 15:04:13 发布

weixin_30556959

最新推荐文章于 2023-07-06 15:04:13 发布

阅读量319

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/Renyi-Fan/p/9100500.html

版权

js如何使用正则表达式验证电话号码（可选区号）和邮箱？（分步骤）

一、总结

js进阶正则表达式16电话号码和邮箱正则（分类解决邮箱验证）（分组加？解决电话号码区号选择问题）（[\w\.-]中括号解决邮箱前半字段的多种情况）

1、var reg=/^(\d{3,4}-)?\d{7,8}$/ //1、分组加？解决电话号码区号选择问题

2、var reg=/^[\w\.-]+@[a-z0-9]+\.[a-z]+$/i //1、[\w\.-]中括号解决邮箱前半字段的多种情况

3、分类或者说分部分来解决邮箱验证

二、js进阶正则表达式16电话号码和邮箱正则

练习3：验证电话号码

实例描述：验证输入的固定电话号码是否合法
案例要点：
区号部分为3-4位数字

使用“-”作为分隔符

电话号码部分为7/8位数字

练习4：验证邮箱

实例描述：验证用户邮箱是否合法
1. 1. 可以分为三部分： // 2、分类或者说分部分来解决邮箱验证
1. 用户名部分为英文、字母、数字、"_"
2. @部分
3. 域名部分，可以分解为英文字母+‘.’+字母三部分

三、代码

1、验证电话号码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>验证电话号码</title>
 6 </head>
 7 <body>
 8   <form name='myform' action=" " method="get" onsubmit="check()">
 9     固定电话：<input type="text" id="sfz" name="email" pattern="^(\d{3,4}-)?\d{7,8}$">
10     <input type="submit"> <input type="reset" value="重置">
11   </form> <br>
12     <script type="text/javascript">
13     var str1='86836180'
14     var str2='010-86836180'
15         // var reg=/^(\d{3,4}-)?\d{7,8}$/ //1、分组加？解决电话号码区号选择问题
16         var reg=/^(\d{3,4}-)?\d{7,8}$/   
17         //alert(reg.test(str2))
18     </script>
19 </body>
20 </html>

2、验证邮箱

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>验证邮箱</title>
 6 </head>
 7 <body>
 8     <form name='myform' action=" " method="get" onsubmit="check()">
 9     邮箱：<input type="text" id="email" name="email" >
10     <input type="submit"> <input type="reset" value="重置">
11   </form> <br>
12   <script>
13   /*
14       var str1=365966179@qq.com
15       var str2=jiyanpeng@126.com
16       var str2=ji_yanpeng@126.com
17       var reg=/^\w+@[a-z0-9]+\.[a-z]+$/i  //注：邮箱种类较多，该模式不能匹配所有的邮箱格式
18       var reg=/^[\w\.-]+@[a-z0-9]+\.[a-z]+$/i   //1、[\w\.-]中括号解决邮箱前半字段的多种情况
19       var reg=/^[\w\.-]+@[\w-]+\.[a-z]+$/i
20 */
21        function check(){
22      var str=document.getElementById('email').value;
23       //var str=myform.email.value;
24        //alert(str)
25       var reg=/^\w+@[a-z0-9]+\.[a-z]+$/i
26       if (reg.test(str)) {
27         alert('格式正确')
28       }else{
29         alert('格式不正确，请重新输入')
30       }   
31     }
32   </script>
33 </body>
34 </html>