验证E-mail是否正确

验证用户输入的E-mail格式是否正确
正则表达式的结构以"/"开头和结尾,一个正则表达式就是由普通字符(如字符a-z)以及特殊字符(称为元字符)组成的文字模式。

应用JavaScript的正则表达式来实现的,验证E-mail地址的正则表达式为
var regExpression = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;

在这里插入图片描述
在这里插入图片描述
使用javascript的内置函数test(),该函数会测试字符串的模式是否与正则表达式的模式相匹配,匹配true,不false。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
function checkEmail(){
	var email=document.getElementById("email");
	if(email.value==null||email.value==""){
		alert("请输入email地址!");
		email.focus();
		return;
	}
	var regExpression = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
	var objExp=new RegExp(regExpression);		//创建正则表达式对象
	if(objExp.test(email.value)==false){		//通过test()函数测试字符串是否与表达式的模式匹配
		alert("您输入的email地址不正确");
	email.focus();			
	return;
	}
	document.getElementById("muform").submit();
}
</script>
<style type="text/css">
		table{
			font-size: 13px;
			font-family: 楷体;
			color:navy;
		}
		input{
			font-size: 13px;
			font-family: 楷体;
			color:navy;
		}
		font{
			font-size: 12px;
			font-family: 楷体;
			color:orangered;
		}
		.style1{
			width: 500;
			height: 260;
		}
	</style>
  </head>
  
  <body>
    <fieldset class="style1"><legend>用户注册</legend>
    
   <form action="" id="myform">
   	<table align="center">
   		<tr>
   			<td>用户名:</td>
   			<td>
   				<input type="text"  id="name"> 			
   			</td>
   		</tr>
   		<tr>
   			<td>密码:</td>
   			<td>
   				<input type="password"  id="pwd"> 			
   			</td>
   		</tr>
   		<tr>
   			<td>确认密码:</td>
   			<td>
   				<input type="password"  id="pwd1"> 			
   			</td>
   		</tr>
   		<tr>
   			<td> 性别:</td>
   			<td>
   				<input type="radio" name="sex" id="man" value="m" />男	
   				<input type="radio" name="sex" id="woman" value="f" />女			
   			</td>
   		</tr>
   		
   		<tr>
   			<td>年龄:</td>
   			<td>
   				<input type="text" id="age">
   			</td>
   		</tr>
   		<tr>
   			<td>密码提示问题:</td>
   			<td>
   				<select name="question">
   					<option>请选择</option>
   					<option>你的父亲叫什么名字?</option>
   					<option>你的小学老师的名字?</option>
   					<option>你的生日?</option>
   					<option>你的初中学校的名字?</option>
   					<option>你喜欢什么颜色?</option>
   					<option>你喜欢吃的水果是?</option>
   				</select>
   			</td>
   		</tr>
   		<tr>
   			<td>密码提示答案:</td>
   			<td>
   				
   				<input type="text" id="answer">
   			</td>
   		</tr>
   		<tr>
   			<td>E-mail:</td>
   			<td>
   				<input type="text" id="email">
   			</td>
   		</tr>
   		<tr>
   			<td align="center" colspan="2">
   				<input type="button" value="提 交" onclick="checkEmail()">
   				
   			</td>
   		</tr>
   	</table>
   	
   </form>
   </fieldset>
  </body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_44234912/article/details/88826495
今日推荐