js表单简单验证（手机号邮箱）

2020-11-07 18:31:37 阅读：288 来源： 互联网

标签：telph tel 手机号表单 alert return false js email

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <html>
 5 <head>
 6 <script type="text/javascript">
 7             function on_click(){
 8                 var email = document.getElementById("input1").value.trim();
 9                 var telph = document.getElementById("input2").value.trim();
10 
11                 if(email == "" ||telph == ""){
12                     alert("The email or telph is blank!!!");
13                     return false;
14                 }
15 
16                 if (email.indexOf("@") == -1){
17                     alert("an @ is not in an email !!!");
18                     return false;
19                 }
20 
21                 var re = /^([0-9]{3}-)?[0-9]{3}-[0-9]{4}$/;
22                 if (re.test(telph) == false){
23                     alert("telph number is not match xxx-xxxx or xxx-xxx-xxxx")
24                     return false;
25                 }
26 
27                 alert("ok, email:" + email + ", telephone:" + telph);
28                 return true;
29             }
30         </script>
31 </head>
32 
33 <body>
34     email:
35     <input id="input1"></input>
36     <br>
37     <!--必须有@-->
38     telph:
39     <input id="input2"></input>
40     <br>
41     <!--必须满足xxx-xxxx or xxx-xxx-xxxx-->
42     
43     <button type="button" onclick=on_click()>test</button>
44 </body>
45 </html>

电话号码的验证：

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <html>
 5 <head>
 6 <script type="text/javascript">
 7             function isValidate(myform){
 8                 var tel=myform.tel.value;
 9                 if(tel.length==0){
10                     alert("手机号码不能是空值！");
11                     tel.focus();
12                     return false;
13                     }
14                 else if(tel.length!=11){
15                     alert("请输入有效位数的手机号码！")
16                     tel.focus();
17                     return false;
18                 }
19                 var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/; 
20                 if(!myreg.test(tel)) { 
21                    alert("请输入正确格式的手机号码！"); 
22                     return false; 
23                   } 
24             }
25         </script>
26 </head>
27 <body>
28     <form method="post" name="myform" action="" >
29     <tr>
30     
31         <td>
32             <font size="3" color="#112266" >手机号码：</font><br>
33             <input type="text" name="tel" value="">
34         </td>
35     </tr>
36     </form>
37     <button type="button" onclick=isValidate(myform)>test</button>
38 </body>
39 </html>

执行效果展示图：

①验证空值：

②验证手机号码位数不对：

③验证手机号格式内容不对（存在非数字内容！）：

标签：telph,tel,手机号,表单,alert,return,false,js,email
来源： https://www.cnblogs.com/rainbow-1/p/13941845.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js表单简单验证（手机号邮箱）